-
Notifications
You must be signed in to change notification settings - Fork 919
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
This pull request introduces a comprehensive update to the homepage, focusing on enhancing its layout, functionality, and configurability. Key changes include: * Initial implementation and iterative improvements of the new homepage layout, including the addition of hero sections and various other sections for improved content organization and presentation. * Introduction of lazy rendering and memoization to optimize performance and user experience. * Refinements in section rendering, including inline rendering, to streamline the page's structure and interactivity. * Removal of unused functions and components, alongside renaming functions for better clarity and alignment with their purpose. * Significant enhancements in testing, ensuring robust functionality through the addition of various unit tests, including jest tests and tests for new observable-based features. * Adjustments and updates following UX guidance, including changes to the footer, welcome screen, and other user interface elements to align with best practices and user expectations. * Conversion of the homepage to use observables for dynamic content updates, and making the new homepage experience configurable, allowing for easy toggling between legacy and new layouts. * Comprehensive cleanup and minor redesign efforts to refine the overall look and feel, alongside the removal of outdated comments and redundant code. * Introduction of a new configuration option to enable/disable the new homepage, providing flexibility and control to users or administrators. * Additional contributions include replacing a YAML config with an advanced setting and fixing the changelog for accurate documentation. --------- Signed-off-by: Matt Provost <[email protected]> Signed-off-by: abbyhu2000 <[email protected]> Signed-off-by: Ashwin P Chandran <[email protected]> Co-authored-by: Matt Provost <[email protected]> Co-authored-by: Ashwin P Chandran <[email protected]>
- Loading branch information
3 people
authored
Mar 15, 2024
1 parent
09f5563
commit d1dd85b
Showing
62 changed files
with
1,739 additions
and
51 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -12,3 +12,4 @@ | |
| @import "synopsis"; | ||
| @import "welcome"; | ||
| @import "tutorial/tutorial"; | ||
| @import "homepage/homepage"; | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
9 changes: 9 additions & 0 deletions
9
src/plugins/home/public/application/components/homepage/_homepage.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| .home-homepage-pageBody { | ||
| // This is needed to make sure the page body is not wider than the page. | ||
| // This is otherwise not possible with the props on EuiPageTemplate. | ||
| padding: 0 $euiSizeL; | ||
| } | ||
|
|
||
| .home-homepage-body--fill { | ||
| min-height: $euiSize * 50; | ||
| } |
105 changes: 105 additions & 0 deletions
105
src/plugins/home/public/application/components/homepage/footer.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,105 @@ | ||
| /* | ||
| * Copyright OpenSearch Contributors | ||
| * SPDX-License-Identifier: Apache-2.0 | ||
| */ | ||
|
|
||
| import React from 'react'; | ||
| import { FormattedMessage } from '@osd/i18n/react'; | ||
| import { EuiFlexGroup, EuiFlexItem, EuiButtonEmpty } from '@elastic/eui'; | ||
| import { i18n } from '@osd/i18n'; | ||
| import { CoreStart } from 'opensearch-dashboards/public'; | ||
| import { HOME_APP_BASE_PATH } from '../../../../common/constants'; | ||
| import { | ||
| RedirectAppLinks, | ||
| useOpenSearchDashboards, | ||
| useUiSetting$, | ||
| } from '../../../../../opensearch_dashboards_react/public'; | ||
|
|
||
| export const Footer: React.FC = () => { | ||
| const [defaultRoute, setDefaultRoute] = useUiSetting$<string>('defaultRoute'); | ||
| const { | ||
| services: { | ||
| application, | ||
| notifications: { toasts }, | ||
| }, | ||
| } = useOpenSearchDashboards<CoreStart>(); | ||
|
|
||
| const getUrlForApp = application.getUrlForApp; | ||
| const { show, save } = application.capabilities.advancedSettings ?? {}; | ||
|
|
||
| const isAdvancedSettingsEnabled = show && save; | ||
|
|
||
| const defaultRouteButton = | ||
| defaultRoute === HOME_APP_BASE_PATH ? ( | ||
| <RedirectAppLinks application={application}> | ||
| <EuiButtonEmpty | ||
| flush="both" | ||
| href={getUrlForApp('management', { path: 'opensearch-dashboards/settings#defaultRoute' })} | ||
| iconType="home" | ||
| size="xs" | ||
| > | ||
| <FormattedMessage | ||
| id="home.footer.changeHomeRouteLink" | ||
| defaultMessage="Display a different page on log in" | ||
| /> | ||
| </EuiButtonEmpty> | ||
| </RedirectAppLinks> | ||
| ) : ( | ||
| <EuiButtonEmpty | ||
| flush="both" | ||
| iconType="home" | ||
| onClick={() => { | ||
| setDefaultRoute(HOME_APP_BASE_PATH); | ||
| toasts.addSuccess({ | ||
| title: i18n.translate('home.footer.changeDefaultRouteSuccessToast', { | ||
| defaultMessage: 'Landing page updated', | ||
| }), | ||
| }); | ||
| }} | ||
| size="xs" | ||
| > | ||
| <FormattedMessage | ||
| id="home.footer.makeDefaultRouteLink" | ||
| defaultMessage="Make this my landing page" | ||
| /> | ||
| </EuiButtonEmpty> | ||
| ); | ||
|
|
||
| return ( | ||
| <EuiFlexGroup direction="row" wrap> | ||
| {isAdvancedSettingsEnabled && <EuiFlexItem grow={false}>{defaultRouteButton}</EuiFlexItem>} | ||
|
|
||
| <EuiFlexItem grow={false}> | ||
| <RedirectAppLinks application={application}> | ||
| <EuiButtonEmpty | ||
| flush="both" | ||
| href={getUrlForApp('home', { path: '#/feature_directory' })} | ||
| iconType="apps" | ||
| size="xs" | ||
| > | ||
| <FormattedMessage | ||
| id="home.footer.appDirectoryButtonLabel" | ||
| defaultMessage="View app directory" | ||
| /> | ||
| </EuiButtonEmpty> | ||
| </RedirectAppLinks> | ||
| </EuiFlexItem> | ||
|
|
||
| <EuiFlexItem grow={false}> | ||
| <RedirectAppLinks application={application}> | ||
| <EuiButtonEmpty | ||
| flush="both" | ||
| href={getUrlForApp('opensearch_dashboards_overview')} | ||
| iconType="visualizeApp" | ||
| size="xs" | ||
| > | ||
| <FormattedMessage | ||
| id="home.footer.visualizeAndAnalyze" | ||
| defaultMessage="Visualize & Analyze" | ||
| /> | ||
| </EuiButtonEmpty> | ||
| </RedirectAppLinks> | ||
| </EuiFlexItem> | ||
| </EuiFlexGroup> | ||
| ); | ||
| }; |
21 changes: 21 additions & 0 deletions
21
src/plugins/home/public/application/components/homepage/hero_section.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| /* | ||
| * Copyright OpenSearch Contributors | ||
| * SPDX-License-Identifier: Apache-2.0 | ||
| */ | ||
|
|
||
| import React, { FC } from 'react'; | ||
| import { EuiPanel } from '@elastic/eui'; | ||
| import { RenderFn } from '../../../services/section_type/section_type'; | ||
| import { LazyRender } from './lazy_render'; | ||
|
|
||
| interface Props { | ||
| render: RenderFn; | ||
| } | ||
|
|
||
| export const HeroSection: FC<Props> = ({ render }) => { | ||
| return ( | ||
| <EuiPanel data-test-subj="homepageHeroSection"> | ||
| <LazyRender render={render} /> | ||
| </EuiPanel> | ||
| ); | ||
| }; |
Oops, something went wrong.