Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: fix undefined process in package #1997

Merged
merged 1 commit into from
Mar 7, 2025
Merged

fix: fix undefined process in package #1997

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 0 additions & 10 deletions config-overrides.js
View file
Original file line number Diff line number Diff line change
@@ -2,16 +2,13 @@

const MiniCSSExtractPlugin = require('mini-css-extract-plugin');
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
const webpack = require('webpack');
const srcRoot = path.resolve(__dirname, 'src');
const uiKitRoot = path.resolve(__dirname, 'node_modules/@gravity-ui/uikit');
const antlr4C3Root = path.resolve(__dirname, 'node_modules/antlr4-c3');
const websqlRoot = path.resolve(__dirname, 'node_modules/@gravity-ui/websql-autocomplete');
const antlr4ngRoot = path.resolve(__dirname, 'node_modules/antlr4ng');
const uiKitIconsRoot = path.resolve(__dirname, 'node_modules/@gravity-ui/icons');

const packageJson = require('./package.json');

module.exports = {
webpack: (config, env) => {
const oneOfRule = config.module.rules.find((r) => r.oneOf);
@@ -35,7 +32,7 @@
});

if (env === 'production') {
config.output.path = path.resolve(__dirname, 'build/');

Check warning on line 35 in config-overrides.js

GitHub Actions / Verify Files 

Assignment to property of function parameter 'config'
}
config.plugins.push(
new MonacoWebpackPlugin({
@@ -48,13 +45,6 @@
}),
);

// Add DefinePlugin to expose just the version
config.plugins.push(
new webpack.DefinePlugin({
'process.env.UI_VERSION': JSON.stringify(packageJson.version),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what's wrong with this approach?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

process.env values are embedded in build, so in build I have
version: process.env.UI_VERSION -> version: 8.11.0

However, when we use it as a package, we have only process.env.UI_VERSION in our code, when we import it and try to open in UI we receive process is not defined error, no variables are exposed

}),
);

const cssExtractPlugin = config.plugins.find((p) => p instanceof MiniCSSExtractPlugin);
if (cssExtractPlugin) {
cssExtractPlugin.options.ignoreOrder = true;
@@ -68,13 +58,13 @@
// By default jest does not transform anything in node_modules
// So this override excludes node_modules except @gravity-ui
// see https://github.com/timarney/react-app-rewired/issues/241
config.transformIgnorePatterns = ['node_modules/(?!(@gravity-ui|@mjackson)/)'];

Check warning on line 61 in config-overrides.js

GitHub Actions / Verify Files 

Assignment to property of function parameter 'config'

// Add .github directory to roots
config.roots = ['<rootDir>/src', '<rootDir>/.github'];

Check warning on line 64 in config-overrides.js

GitHub Actions / Verify Files 

Assignment to property of function parameter 'config'

// Update testMatch to include .github directory
config.testMatch = [

Check warning on line 67 in config-overrides.js

GitHub Actions / Verify Files 

Assignment to property of function parameter 'config'
'<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}',
'<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}',
'<rootDir>/.github/**/*.{spec,test}.{js,jsx,ts,tsx}',
3 changes: 1 addition & 2 deletions package-lock.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 1 addition & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -164,8 +164,7 @@
"source-map-explorer": "^2.5.3",
"stylelint": "^15.11.0",
"ts-jest": "^29.2.5",
"typescript": "^5.7.3",
"webpack": "^5.98.0"
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is no need to install it explicitly

"typescript": "^5.7.3"
},
"peerDependencies": {
"monaco-yql-languages": ">=1.3.0",
2 changes: 1 addition & 1 deletion public/index.html
View file
Original file line number Diff line number Diff line change
@@ -21,10 +21,10 @@
<title>YDB Monitoring</title>
<script>
window.systemSettings = {};
window.userSettings = {};
window.web_version = !'%REACT_APP_BACKEND%';
window.custom_backend = '%NODE_ENV%' === 'development' && '%REACT_APP_BACKEND%';
window.meta_backend = '%REACT_APP_META_BACKEND%'
window.react_app_disable_checks = '%REACT_APP_DISABLE_CHECKS%'
</script>
</head>
<body>
4 changes: 3 additions & 1 deletion src/components/ErrorBoundary/utils.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import {prepareErrorMessage} from '../../utils/prepareErrorMessage';

import packageJson from '../../../package.json';

export async function collectDiagnosticsData(error: Error) {
return await getBackendVersion().then((backendVersion) => {
return {
@@ -9,7 +11,7 @@ export async function collectDiagnosticsData(error: Error) {
message: prepareErrorMessage(error),
stack: prepareErrorStack(error.stack, {trim: true, maxLines: 10}),
},
uiVersion: process.env.UI_VERSION,
uiVersion: packageJson.version,
backendVersion,
};
});
4 changes: 3 additions & 1 deletion src/containers/UserSettings/settings.tsx
View file
Original file line number Diff line number Diff line change
@@ -21,6 +21,8 @@ import {Lang, defaultLang} from '../../utils/i18n';
import type {SettingProps, SettingsInfoFieldProps} from './Setting';
import i18n from './i18n';

import packageJson from '../../../package.json';

export interface SettingsSection {
id: string;
title: string;
@@ -141,7 +143,7 @@ export const autocompleteOnEnterSetting: SettingProps = {
export const interfaceVersionInfoField: SettingsInfoFieldProps = {
title: i18n('settings.about.interfaceVersionInfoField.title'),
type: 'info',
content: process.env.UI_VERSION,
content: packageJson.version,
Copy link
Collaborator

@astandrik astandrik Mar 7, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Have you tried sth like window.ui_version? the same way it is used for react_app_disable_checks

Still feel that using package.json directly may have pitfalls.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried index.html, the problem is that webpack.DefinePlugin does not expose vars to html files, so we can use them in js, but not in index.html (but all envs passed in command or taken from .env file work fine).

};

export const appearanceSection: SettingsSection = {
4 changes: 2 additions & 2 deletions src/store/configureStore.ts
View file
Original file line number Diff line number Diff line change
@@ -28,12 +28,12 @@ function _configureStore<
preloadedState,
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware({
immutableCheck: process.env.REACT_APP_DISABLE_CHECKS
immutableCheck: window.react_app_disable_checks
? false
: {
ignoredPaths: ['tooltip.currentHoveredRef'],
},
serializableCheck: process.env.REACT_APP_DISABLE_CHECKS
serializableCheck: window.react_app_disable_checks
? false
: {
ignoredPaths: ['tooltip.currentHoveredRef', 'api'],
3 changes: 2 additions & 1 deletion src/types/window.d.ts
View file
Original file line number Diff line number Diff line change
@@ -39,7 +39,8 @@ interface Window {
meta_backend?: string;
code_assist_backend?: string;

userSettings?: import('../services/settings').SettingsObject;
react_app_disable_checks?: boolean;

systemSettings?: import('../services/settings').SettingsObject;

api: import('../services/api/index').YdbEmbeddedAPI;
Loading