Skip to content

Commit

Permalink
Enable theme-switching via Advanced Settings to preview the Next theme
Browse files Browse the repository at this point in the history
Signed-off-by: Miki <[email protected]>
  • Loading branch information
AMoo-Miki committed Jul 1, 2023
1 parent bbf8dfb commit e0c1f75
Show file tree
Hide file tree
Showing 14 changed files with 28 additions and 32 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@
"dependencies": {
"@aws-crypto/client-node": "^3.1.1",
"@elastic/datemath": "5.0.3",
"@elastic/eui": "npm:@opensearch-project/oui@1.1.2",
"@elastic/eui": "npm:@opensearch-project/oui@1.3.0-alpha.2",
"@elastic/good": "^9.0.1-kibana3",
"@elastic/numeral": "^2.5.0",
"@elastic/request-crypto": "2.0.0",
Expand Down
4 changes: 2 additions & 2 deletions packages/osd-ui-shared-deps/theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -46,8 +46,8 @@ if (version === 7) {
euiLightVars = require('@elastic/eui/dist/eui_theme_light.json');
euiDarkVars = require('@elastic/eui/dist/eui_theme_dark.json');
} else {
euiLightVars = require('@elastic/eui/dist/eui_theme_amsterdam_light.json');
euiDarkVars = require('@elastic/eui/dist/eui_theme_amsterdam_dark.json');
euiLightVars = require('@elastic/eui/dist/eui_theme_next_light.json');
euiDarkVars = require('@elastic/eui/dist/eui_theme_next_dark.json');
}

/**
Expand Down
4 changes: 2 additions & 2 deletions packages/osd-ui-shared-deps/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,8 @@ exports.getWebpackConfig = ({ dev = false } = {}) => ({
'osd-ui-shared-deps': './entry.js',
'osd-ui-shared-deps.v7.dark': ['@elastic/eui/dist/eui_theme_dark.css'],
'osd-ui-shared-deps.v7.light': ['@elastic/eui/dist/eui_theme_light.css'],
'osd-ui-shared-deps.v8.dark': ['@elastic/eui/dist/eui_theme_amsterdam_dark.css'],
'osd-ui-shared-deps.v8.light': ['@elastic/eui/dist/eui_theme_amsterdam_light.css'],
'osd-ui-shared-deps.v8.dark': ['@elastic/eui/dist/eui_theme_next_dark.css'],
'osd-ui-shared-deps.v8.light': ['@elastic/eui/dist/eui_theme_next_light.css'],
},
context: __dirname,
devtool: dev ? '#cheap-source-map' : false,
Expand Down
4 changes: 2 additions & 2 deletions src/core/public/core_app/styles/_globals_v8dark.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@
// ---
// prepended to all .scss imports (from JS, when v8dark theme selected)

@import "@elastic/eui/src/themes/eui-amsterdam/eui_amsterdam_colors_dark";
@import "@elastic/eui/src/themes/eui-amsterdam/eui_amsterdam_globals";
@import "@elastic/eui/src/themes/eui-next/eui_next_colors_dark";
@import "@elastic/eui/src/themes/eui-next/eui_next_globals";
@import "./mixins";
4 changes: 2 additions & 2 deletions src/core/public/core_app/styles/_globals_v8light.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,6 @@
// ---
// prepended to all .scss imports (from JS, when v8light theme selected)

@import "@elastic/eui/src/themes/eui-amsterdam/eui_amsterdam_colors_light";
@import "@elastic/eui/src/themes/eui-amsterdam/eui_amsterdam_globals";
@import "@elastic/eui/src/themes/eui-next/eui_next_colors_light";
@import "@elastic/eui/src/themes/eui-next/eui_next_globals";
@import "./mixins";
4 changes: 2 additions & 2 deletions src/core/server/ui_settings/settings/theme.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -57,11 +57,11 @@ describe('theme settings', () => {

it('should only accept valid values', () => {
expect(() => validate('v7')).not.toThrow();
expect(() => validate('v8 (beta)')).not.toThrow();
expect(() => validate('Next (preview)')).not.toThrow();
expect(() => validate('v12')).toThrowErrorMatchingInlineSnapshot(`
"types that failed validation:
- [0]: expected value to equal [v7]
- [1]: expected value to equal [v8 (beta)]"
- [1]: expected value to equal [Next (preview)]"
`);
});
});
Expand Down
5 changes: 2 additions & 3 deletions src/core/server/ui_settings/settings/theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -51,13 +51,12 @@ export const getThemeSettings = (): Record<string, UiSettingsParams> => {
}),
value: 'v7',
type: 'select',
options: ['v7', 'v8 (beta)'],
options: ['v7', 'Next (preview)'],
description: i18n.translate('core.ui_settings.params.themeVersionText', {
defaultMessage: `Switch between the theme used for the current and next version of OpenSearch Dashboards, A page refresh is required for the setting to be applied.`,
}),
requiresPageReload: true,
schema: schema.oneOf([schema.literal('v7'), schema.literal('v8 (beta)')]),
readonly: true,
schema: schema.oneOf([schema.literal('v7'), schema.literal('Next (preview)')]),
},
};
};
6 changes: 3 additions & 3 deletions src/core/server/ui_settings/ui_settings_client.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -644,7 +644,7 @@ describe('ui settings', () => {
});

it('returns the overridden value for key theme:version', async () => {
const opensearchDocSource = { 'theme:version': 'v8 (beta)' };
const opensearchDocSource = { 'theme:version': 'Next (preview)' };
const overrides = { 'theme:version': 'v7' };
const { uiSettings } = setup({ opensearchDocSource, overrides });

Expand All @@ -660,10 +660,10 @@ describe('ui settings', () => {
});

it('rewrites the key theme:version value without override', async () => {
const opensearchDocSource = { 'theme:version': 'v8 (beta)' };
const opensearchDocSource = { 'theme:version': 'Next (preview)' };
const { uiSettings } = setup({ opensearchDocSource });

expect(await uiSettings.get('theme:version')).toBe('v8 (beta)');
expect(await uiSettings.get('theme:version')).toBe('Next (preview)');
});

it('returns the default value for an override with value null', async () => {
Expand Down
8 changes: 1 addition & 7 deletions src/core/server/ui_settings/ui_settings_config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -53,13 +53,7 @@ const deprecations: ConfigDeprecationProvider = ({ unused, renameFromRoot }) =>
*/

const configSchema = schema.object({
overrides: schema.object(
{
'theme:darkMode': schema.maybe(schema.boolean({ defaultValue: true })),
'theme:version': schema.string({ defaultValue: 'v7' }),
},
{ unknowns: 'allow' }
),
overrides: schema.object({}, { unknowns: 'allow' }),
defaults: schema.object({
'theme:darkMode': schema.maybe(schema.boolean({ defaultValue: false })),
'theme:version': schema.maybe(schema.string({ defaultValue: 'v7' })),
Expand Down
5 changes: 4 additions & 1 deletion src/legacy/ui/ui_render/ui_render_mixin.js
Original file line number Diff line number Diff line change
Expand Up @@ -98,8 +98,11 @@ export function uiRenderMixin(osdServer, server, config) {
: uiSettings.getOverrideOrDefault('theme:darkMode');

const themeVersion =
!authEnabled || request.auth.isAuthenticated ? await uiSettings.get('theme:version') : 'v7';
!authEnabled || request.auth.isAuthenticated
? await uiSettings.get('theme:version')
: uiSettings.getOverrideOrDefault('theme:version');

// Next (preview) label is mapped to v8 here
const themeTag = `${themeVersion === 'v7' ? 'v7' : 'v8'}${darkMode ? 'dark' : 'light'}`;

const buildHash = server.newPlatform.env.packageInfo.buildNum;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
"build": "../../../../scripts/use_node ../../../../scripts/remove.js './target' && tsc"
},
"devDependencies": {
"@elastic/eui": "npm:@opensearch-project/oui@1.1.2",
"@elastic/eui": "npm:@opensearch-project/oui@1.3.0-alpha.2",
"@osd/plugin-helpers": "1.0.0",
"react": "^16.14.0",
"react-dom": "^16.12.0",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
"build": "../../../../scripts/use_node ../../../../scripts/remove.js './target' && tsc"
},
"devDependencies": {
"@elastic/eui": "npm:@opensearch-project/oui@1.1.2",
"@elastic/eui": "npm:@opensearch-project/oui@1.3.0-alpha.2",
"react": "^16.14.0",
"typescript": "4.0.2"
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
"build": "../../../../scripts/use_node ../../../../scripts/remove.js './target' && tsc"
},
"devDependencies": {
"@elastic/eui": "npm:@opensearch-project/oui@1.1.2",
"@elastic/eui": "npm:@opensearch-project/oui@1.3.0-alpha.2",
"@osd/plugin-helpers": "1.0.0",
"react": "^16.14.0",
"typescript": "4.0.2"
Expand Down
8 changes: 4 additions & 4 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1273,10 +1273,10 @@
resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-0.0.2.tgz#56b9ef03984a05cc213772ae3713ea8ef47b0314"
integrity sha512-IoxURM5zraoQ7C8f+mJb9HYSENiZGgRVcG4tLQxE61yHNNRDXtGDWTZh8N1KIHcsqN1CEPETjuzBXkJYF/fDiQ==

"@elastic/eui@npm:@opensearch-project/oui@1.1.2":
version "1.1.2"
resolved "https://registry.yarnpkg.com/@opensearch-project/oui/-/oui-1.1.2.tgz#38ebe687d856715f3a5d8662505e67966e1e3617"
integrity sha512-+gLzltuSjhR2Uz0DGaqYOysoh7WG9I+LvAZnYeyFsYxeAhvDmd5mLggyBWciqwj0h5yDJUV6uEuf9k88WiyAGA==
"@elastic/eui@npm:@opensearch-project/oui@1.3.0-alpha.2":
version "1.3.0-alpha.2"
resolved "https://registry.yarnpkg.com/@opensearch-project/oui/-/oui-1.3.0-alpha.2.tgz#90060e68ba9809239b7ee22a4f12c65e94e80028"
integrity sha512-RZ+23jgnz2vYgfipd++gNT9zsSNbqm8XEyE9vr6jMMGiwL/XCUJ/7Vli5Z3BpQb1XPQVklRQscMoG2UT9xEpxQ==
dependencies:
"@types/chroma-js" "^2.0.0"
"@types/lodash" "^4.14.160"
Expand Down

0 comments on commit e0c1f75

Please sign in to comment.