diff --git a/config/webpack.config.js b/config/webpack.config.js index 1fd99baf55..db54168c2a 100644 --- a/config/webpack.config.js +++ b/config/webpack.config.js @@ -161,6 +161,7 @@ module.exports = function (webpackEnv) { // There will be one main bundle, and one file per asynchronous chunk. // In development, it does not produce real files. filename: 'static/js/graph-explorer-v2.js', + chunkFilename: 'static/js/graph-explorer.chunk.[name].[chunkhash].js', // We inferred the "public path" (such as / or /my-project) from homepage. // We use "/" in development. publicPath, @@ -413,7 +414,7 @@ module.exports = function (webpackEnv) { }, plugins: [ new webpack.optimize.LimitChunkCountPlugin({ - maxChunks: 1 + maxChunks: 50 }), new MonacoWebpackPlugin({ languages: [ diff --git a/src/app/services/hooks/usePopups.ts b/src/app/services/hooks/usePopups.ts index 6e3368d5a3..c228faa369 100644 --- a/src/app/services/hooks/usePopups.ts +++ b/src/app/services/hooks/usePopups.ts @@ -1,10 +1,24 @@ -import { PopupItem, popups } from '../../views/common/registry/popups'; +import { + ShareQuery, FullPermissions, PreviewCollection, ThemeChoser +} from '../../views/common/lazy-loader/component-registry'; import { POPUPS, PopupsProps, PopupsType, UsePopupsResponse, usePopupsDispatchContext, usePopupsStateContext } from '../context/popups-context'; +type PopupItem = + 'share-query' | + 'theme-chooser' | + 'preview-collection' | + 'full-permissions'; + +const popups = new Map([ + ['share-query', ShareQuery], + ['theme-chooser', ThemeChoser], + ['preview-collection', PreviewCollection], + ['full-permissions', FullPermissions] +]) const usePopups = (item: PopupItem , type: PopupsType, reference?: string): UsePopupsResponse => { diff --git a/src/app/views/App.tsx b/src/app/views/App.tsx index 2bdb47676f..441357f2b0 100644 --- a/src/app/views/App.tsx +++ b/src/app/views/App.tsx @@ -26,11 +26,12 @@ import { GRAPH_URL } from '../services/graph-constants'; import { parseSampleUrl } from '../utils/sample-url-generation'; import { substituteTokens } from '../utils/token-helpers'; import { translateMessage } from '../utils/translate-messages'; -import { StatusMessages, TermsOfUseMessage } from './app-sections'; +import { TermsOfUseMessage } from './app-sections'; +import { StatusMessages } from './common/lazy-loader/component-registry'; import { headerMessaging } from './app-sections/HeaderMessaging'; import { appStyles } from './App.styles'; import { classNames } from './classnames'; -import { KeyboardCopyEvent } from './common/copy/KeyboardCopyEvent'; +import { KeyboardCopyEvent } from './common/copy-button/KeyboardCopyEvent'; import PopupsWrapper from './common/popups/PopupsWrapper'; import { createShareLink } from './common/share'; import { MainHeader } from './main-header/MainHeader'; @@ -38,7 +39,6 @@ import { QueryResponse } from './query-response'; import { QueryRunner } from './query-runner'; import { parse } from './query-runner/util/iframe-message-parser'; import { Sidebar } from './sidebar/Sidebar'; - export interface IAppProps { theme?: ITheme; styles?: object; diff --git a/src/app/views/authentication/profile/Profile.tsx b/src/app/views/authentication/profile/Profile.tsx index a5384deb37..24399483fe 100644 --- a/src/app/views/authentication/profile/Profile.tsx +++ b/src/app/views/authentication/profile/Profile.tsx @@ -15,7 +15,6 @@ import { translateMessage } from '../../../utils/translate-messages'; import { classNames } from '../../classnames'; import { authenticationStyles } from '../Authentication.styles'; import { profileStyles } from './Profile.styles'; - const getInitials = (name: string) => { let initials = ''; if (name && name !== '') { diff --git a/src/app/views/common/copy/CopyButton.tsx b/src/app/views/common/copy-button/CopyButton.tsx similarity index 95% rename from src/app/views/common/copy/CopyButton.tsx rename to src/app/views/common/copy-button/CopyButton.tsx index bcd335bc80..74249eb486 100644 --- a/src/app/views/common/copy/CopyButton.tsx +++ b/src/app/views/common/copy-button/CopyButton.tsx @@ -9,7 +9,7 @@ interface ICopyButtonProps { isIconButton: boolean; } -export function CopyButton(props:ICopyButtonProps) { +export default function CopyButton(props:ICopyButtonProps) { const [copied, setCopied] = useState(false); const copyIcon: IIconProps = { diff --git a/src/app/views/common/copy/KeyboardCopyEvent.ts b/src/app/views/common/copy-button/KeyboardCopyEvent.ts similarity index 97% rename from src/app/views/common/copy/KeyboardCopyEvent.ts rename to src/app/views/common/copy-button/KeyboardCopyEvent.ts index f7fa74de3d..8fe018eb95 100644 --- a/src/app/views/common/copy/KeyboardCopyEvent.ts +++ b/src/app/views/common/copy-button/KeyboardCopyEvent.ts @@ -20,7 +20,7 @@ export const KeyboardCopyEvent = () => { }); const filteredTargetIds = targetIds.filter((value) => value !== null)!; const componentName = Object.keys(componentList).find(key => filteredTargetIds.includes(key)); - return componentName || ''; + return componentName ?? ''; } const getTargetId = (target: EventTarget) => { diff --git a/src/app/views/common/copy-button/index.ts b/src/app/views/common/copy-button/index.ts new file mode 100644 index 0000000000..b7452c10ff --- /dev/null +++ b/src/app/views/common/copy-button/index.ts @@ -0,0 +1,2 @@ +import CopyButton from './CopyButton'; +export default CopyButton; \ No newline at end of file diff --git a/src/app/views/common/error-boundary/ErrorBoundary.tsx b/src/app/views/common/error-boundary/ErrorBoundary.tsx index 9b92abb01f..a540b10bc3 100644 --- a/src/app/views/common/error-boundary/ErrorBoundary.tsx +++ b/src/app/views/common/error-boundary/ErrorBoundary.tsx @@ -1,6 +1,5 @@ import { Label } from '@fluentui/react'; import React, { ReactNode, useState, useEffect } from 'react'; - import { translateMessage } from '../../../utils/translate-messages'; interface Props { @@ -27,7 +26,7 @@ function ErrorBoundary(props: Props) { }; if (state.hasError) { - return ; + return ; } else { return ( @@ -39,4 +38,4 @@ function ErrorBoundary(props: Props) { } } -export default ErrorBoundary; \ No newline at end of file +export default ErrorBoundary; diff --git a/src/app/views/common/lazy-loader/component-registry/index.tsx b/src/app/views/common/lazy-loader/component-registry/index.tsx new file mode 100644 index 0000000000..78b02e1fd4 --- /dev/null +++ b/src/app/views/common/lazy-loader/component-registry/index.tsx @@ -0,0 +1,156 @@ +/* eslint-disable max-len */ +import { lazy } from 'react'; +import { IPermissionProps } from '../../../../../types/permissions'; +import { SuspenseLoader } from '../suspense-loader/SuspenseLoader'; + +const LazySpecificPermissions = lazy(() => + import(/* webpackChunkName: "permissions" */ '../../../query-runner/request/permissions')); +const LazyStatusMessages = lazy( () => + import(/* webpackChunkName: "statusMessages" */ '../../../app-sections/StatusMessages')); +const LazyResponseHeaders = lazy(() => + import(/* webpackChunkName: "responseHeaders" */ '../../../query-response/headers/ResponseHeaders')); +const LazyAdaptiveCard = lazy(() => + import(/* webpackChunkName: "adaptiveCards" */ '../../../query-response/adaptive-cards/AdaptiveCard')); +const LazyGraphToolkit = lazy(() => + import(/* webpackChunkName: "graphToolkit" */ '../../../query-response/graph-toolkit/GraphToolkit')); +const LazySnippets = lazy(() => + import(/* webpackChunkName: "code snippets" */ '../../../query-response/snippets/Snippets')); +const LazyCopyButton = lazy(() => + import(/* webpackChunkName: "copy button" */ '../../copy-button/CopyButton')); +const LazyAuth = lazy(() => + import(/* webpackChunkName: "authTab" */ '../../../query-runner/request/auth/Auth')); +const LazyRequestHeaders = lazy(() => + import(/* webpackChunkName: "requestHeaders" */ '../../../query-runner/request/headers/RequestHeaders')); +const LazyHistory = lazy(() => + import(/* webpackChunkName: "history" */ '../../../sidebar/history/History')); +const LazyResourceExplorer = lazy(() => + import(/* webpackChunkName: "resourceExplorer" */ '../../../sidebar/resource-explorer/ResourceExplorer')); +const LazyShareQuery = lazy(() => + import(/* webpackChunkName: "share query" */ '../../../query-runner/query-input/share-query/ShareQuery')); +const LazyThemeChoser = lazy(() => + import(/* webpackChunkName: "theme chooser" */ '../../../main-header/settings/ThemeChooser')); +const LazyPreviewCollection = lazy(() => + import(/* webpackChunkName: "preview collection" */ '../../../sidebar/resource-explorer/collection/PreviewCollection')); +const LazyFullPermissions = lazy(() => + import(/* webpackChunkName: "full permissions" */ '../../../query-runner/request/permissions/Permissions.Full')); + +export const Permissions = (props?: IPermissionProps) => { + return ( + + + + ) +} + +export const StatusMessages = () => { + return ( + + + + ) +} + +export const AdaptiveCards = (props?: any) => { + return ( + + + + ) +} + +export const GraphToolkit = (props?: any) => { + return ( + + + + ) +} + +export const ResponseHeaders = (props?: any) => { + return ( + + + + ) +} + +export const Snippets = (props?: any) => { + return ( + + + + ) +} + +export const CopyButton = (props?: any) => { + return ( + + + + ) +} + +export const Auth = (props?: any) => { + return ( + + + + ) +} + +export const RequestHeaders = (props?: any) => { + return ( + + + + ) +} + +export const History = (props?: any) => { + return ( + + + + ) +} + +export const ResourceExplorer = (props?: any) => { + return ( + + + + ) +} + +export const ShareQuery = (props?: any) => { + return ( + + + + ) +} + +export const ThemeChoser = (props?: any) => { + return ( + + + + ) +} + +export const PreviewCollection = (props?: any) => { + return ( + + + + ) +} + +export const FullPermissions = (props?: any) => { + return ( + + + + ) +} + diff --git a/src/app/views/common/lazy-loader/suspense-loader/SuspenseLoader.tsx b/src/app/views/common/lazy-loader/suspense-loader/SuspenseLoader.tsx new file mode 100644 index 0000000000..869e0f0dcf --- /dev/null +++ b/src/app/views/common/lazy-loader/suspense-loader/SuspenseLoader.tsx @@ -0,0 +1,16 @@ +import { Spinner, SpinnerSize } from '@fluentui/react'; +import { Suspense } from 'react'; +import ErrorBoundary from '../../error-boundary/ErrorBoundary'; + +interface SuspenseChildren{ + children: React.ReactNode; +} +export const SuspenseLoader = ({ children }: SuspenseChildren) => { + return ( + + }> + {children} + + + ); +} \ No newline at end of file diff --git a/src/app/views/common/registry/popups.tsx b/src/app/views/common/registry/popups.tsx deleted file mode 100644 index ecd1065473..0000000000 --- a/src/app/views/common/registry/popups.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { lazy } from 'react'; - -export const popups = new Map([ - ['share-query', lazy(() => import('../../query-runner/query-input/share-query/ShareQuery'))], - ['theme-chooser', lazy(() => import('../../main-header/settings/ThemeChooser'))], - ['preview-collection', lazy(() => import('../../sidebar/resource-explorer/collection/PreviewCollection'))], - ['full-permissions', lazy(() => import('../../query-runner/request/permissions/Permissions.Full'))] -]); - -export type PopupItem = - 'share-query' | - 'theme-chooser' | - 'preview-collection' | - 'full-permissions'; diff --git a/src/app/views/main-header/FeedbackButton.tsx b/src/app/views/main-header/FeedbackButton.tsx index 259291171d..921fded880 100644 --- a/src/app/views/main-header/FeedbackButton.tsx +++ b/src/app/views/main-header/FeedbackButton.tsx @@ -1,35 +1,52 @@ -import { getTheme, IButton, IconButton, IIconProps, TooltipHost } from '@fluentui/react'; -import { useRef, useState, useEffect } from 'react'; +import { + getTheme, + IButton, + IconButton, + IIconProps, + TooltipHost +} from '@fluentui/react'; +import { useRef, useState, useEffect, lazy, Suspense } from 'react'; import { translateMessage } from '../../utils/translate-messages'; -import FeedbackForm from '../query-runner/request/feedback/FeedbackForm'; +const FeedbackForm = lazy( + () => + import( + /* webpackChunkName: "feedback-form" */ '../query-runner/request/feedback/FeedbackForm' + ) +); import { ACCOUNT_TYPE } from '../../services/graph-constants'; import { componentNames, eventTypes, telemetry } from '../../../telemetry'; import { useAppSelector } from '../../../store'; export const FeedbackButton = () => { const [enableSurvey, setEnableSurvey] = useState(false); + const [renderSurvey, setRenderSurvey] = useState(false); const { profile } = useAppSelector((state) => state); const currentTheme = getTheme(); - const feedbackIcon : IIconProps = { - iconName : 'Feedback' - } + const feedbackIcon: IIconProps = { + iconName: 'Feedback' + }; const feedbackTitle = translateMessage('Feedback'); - const content =
{translateMessage('Feedback')}
+ const content = ( +
{translateMessage('Feedback')}
+ ); - const feedbackButtonRef = useRef(null) - const isFirstRender = useRef(true); - useEffect( () => { - if (isFirstRender.current) { - isFirstRender.current = false; + const feedbackButtonRef = useRef(null); + const isFirstSurveyRender = useRef(true); + useEffect(() => { + if (enableSurvey && !renderSurvey) { + setRenderSurvey(true); + } + if (isFirstSurveyRender.current) { + isFirstSurveyRender.current = false; return; } - if(!enableSurvey){ + if (!enableSurvey) { feedbackButtonRef.current?.focus(); } - },[enableSurvey]) + }, [enableSurvey, renderSurvey]); const feedbackIconStyles = { - root:{ + root: { height: '50px', width: '50px', marginTop: '-8px', @@ -37,54 +54,63 @@ export const FeedbackButton = () => { background: `${currentTheme.palette.neutralLight} !important` } } - } + }; const calloutProps = { gapSpace: 0 }; - const hostStyles = { root: { - display: 'inline-block' - } + const hostStyles = { + root: { + display: 'inline-block' + } }; const activateSurvey = () => { setEnableSurvey(true); trackFeedbackButtonEvent(); - } + }; const disableSurvey = () => { setEnableSurvey(false); - } + }; const trackFeedbackButtonEvent = () => { telemetry.trackEvent(eventTypes.BUTTON_CLICK_EVENT, { ComponentName: componentNames.FEEDBACK_BUTTON }); - } + }; return (
- {profile?.profileType !== ACCOUNT_TYPE.AAD && -
- - - - - -
- } + {profile?.profileType !== ACCOUNT_TYPE.AAD && ( +
+ + + + {renderSurvey && ( + /* use null as a fallback as the feedback form renders in a different DOM sub-tree */ + + + + )} +
+ )}
- ) -} \ No newline at end of file + ); +}; diff --git a/src/app/views/query-response/adaptive-cards/AdaptiveCard.tsx b/src/app/views/query-response/adaptive-cards/AdaptiveCard.tsx index 8f8b527a0b..4af888c27f 100644 --- a/src/app/views/query-response/adaptive-cards/AdaptiveCard.tsx +++ b/src/app/views/query-response/adaptive-cards/AdaptiveCard.tsx @@ -15,7 +15,7 @@ import { translateMessage } from '../../../utils/translate-messages'; import { classNames } from '../../classnames'; import { Monaco } from '../../common'; import { trackedGenericCopy } from '../../common/copy'; -import { CopyButton } from '../../common/copy/CopyButton'; +import { CopyButton } from '../../common/lazy-loader/component-registry'; import { convertVhToPx, getResponseEditorHeight, getResponseHeight } from '../../common/dimensions/dimensions-adjustment'; import { queryResponseStyles } from './../queryResponse.styles'; @@ -126,7 +126,7 @@ const AdaptiveCard = (props: any) => { } return ( onPivotItemClick(sampleQuery, pivotItem)} + onLinkClick={(pivotItem: PivotItem | undefined) => onPivotItemClick(sampleQuery, pivotItem)} styles={{ text: { fontSize: FontSizes.size14 } }}> { } // @ts-ignore -const styledAdaptiveCard = styled(AdaptiveCard, queryResponseStyles as any); +const styledAdaptiveCard = styled(AdaptiveCard, queryResponseStyles); const trackedComponent = telemetry.trackReactComponent(styledAdaptiveCard, componentNames.ADAPTIVE_CARDS_TAB); // @ts-ignore const IntlAdaptiveCard = injectIntl(trackedComponent); diff --git a/src/app/views/query-response/headers/ResponseHeaders.tsx b/src/app/views/query-response/headers/ResponseHeaders.tsx index 5971a9afdd..026061af34 100644 --- a/src/app/views/query-response/headers/ResponseHeaders.tsx +++ b/src/app/views/query-response/headers/ResponseHeaders.tsx @@ -3,9 +3,9 @@ import { RESPONSE_HEADERS_COPY_BUTTON } from '../../../../telemetry/component-na import { Monaco } from '../../common'; import { trackedGenericCopy } from '../../common/copy'; +import { CopyButton } from '../../common/lazy-loader/component-registry'; import { convertVhToPx, getResponseEditorHeight, getResponseHeight } from '../../common/dimensions/dimensions-adjustment'; -import { CopyButton } from '../../common/copy/CopyButton'; import { useAppSelector } from '../../../../store'; const ResponseHeaders = () => { diff --git a/src/app/views/query-response/headers/index.ts b/src/app/views/query-response/headers/index.ts index 45527f1fe5..afc1c6ef04 100644 --- a/src/app/views/query-response/headers/index.ts +++ b/src/app/views/query-response/headers/index.ts @@ -1,2 +1,3 @@ import ResponseHeaders from './ResponseHeaders'; -export { ResponseHeaders }; + +export default ResponseHeaders; diff --git a/src/app/views/query-response/pivot-items/pivot-items.tsx b/src/app/views/query-response/pivot-items/pivot-items.tsx index 0a36e9d5d7..1cf450d309 100644 --- a/src/app/views/query-response/pivot-items/pivot-items.tsx +++ b/src/app/views/query-response/pivot-items/pivot-items.tsx @@ -8,13 +8,11 @@ import { lookupTemplate } from '../../../utils/adaptive-cards-lookup'; import { validateExternalLink } from '../../../utils/external-link-validation'; import { lookupToolkitUrl } from '../../../utils/graph-toolkit-lookup'; import { translateMessage } from '../../../utils/translate-messages'; -import AdaptiveCard from '../adaptive-cards/AdaptiveCard'; import { darkThemeHostConfig, lightThemeHostConfig } from '../adaptive-cards/AdaptiveHostConfig'; -import GraphToolkit from '../graph-toolkit/GraphToolkit'; -import { ResponseHeaders } from '../headers'; import { queryResponseStyles } from '../queryResponse.styles'; import { Response } from '../response'; -import { Snippets } from '../snippets'; +import { AdaptiveCards, GraphToolkit, ResponseHeaders, + Snippets } from '../../common/lazy-loader/component-registry'; export const GetPivotItems = () => { @@ -134,7 +132,7 @@ export const GetPivotItems = () => { {(theme) => ( // @ts-ignore
- diff --git a/src/app/views/query-response/snippets/Snippets.tsx b/src/app/views/query-response/snippets/Snippets.tsx index 0ad86c9392..9a8188709e 100644 --- a/src/app/views/query-response/snippets/Snippets.tsx +++ b/src/app/views/query-response/snippets/Snippets.tsx @@ -63,7 +63,8 @@ function GetSnippets() { {renderSnippets(supportedLanguages)} ; } -export const Snippets = telemetry.trackReactComponent( +const Snippets = telemetry.trackReactComponent( GetSnippets, componentNames.CODE_SNIPPETS_TAB ); +export default Snippets; \ No newline at end of file diff --git a/src/app/views/query-response/snippets/index.tsx b/src/app/views/query-response/snippets/index.tsx index 2a223227bf..7829ae60c2 100644 --- a/src/app/views/query-response/snippets/index.tsx +++ b/src/app/views/query-response/snippets/index.tsx @@ -1 +1,2 @@ -export { Snippets } from './Snippets'; +import Snippets from './Snippets'; +export default Snippets; diff --git a/src/app/views/query-response/snippets/snippets-helper.tsx b/src/app/views/query-response/snippets/snippets-helper.tsx index 8e2cfa498c..23c4012cf3 100644 --- a/src/app/views/query-response/snippets/snippets-helper.tsx +++ b/src/app/views/query-response/snippets/snippets-helper.tsx @@ -11,7 +11,7 @@ import { AppDispatch, useAppSelector } from '../../../../store'; import { componentNames, telemetry } from '../../../../telemetry'; import { CODE_SNIPPETS_COPY_BUTTON } from '../../../../telemetry/component-names'; import { translateMessage } from '../../../utils/translate-messages'; -import { CopyButton } from '../../common/copy/CopyButton'; +import { CopyButton } from '../../common/lazy-loader/component-registry'; import { convertVhToPx, getResponseEditorHeight, getResponseHeight } from '../../common/dimensions/dimensions-adjustment'; import { getSnippetStyles } from './Snippets.styles'; diff --git a/src/app/views/query-runner/query-input/share-query/ShareQuery.tsx b/src/app/views/query-runner/query-input/share-query/ShareQuery.tsx index c7e819a080..9381bea57b 100644 --- a/src/app/views/query-runner/query-input/share-query/ShareQuery.tsx +++ b/src/app/views/query-runner/query-input/share-query/ShareQuery.tsx @@ -7,9 +7,8 @@ import { PopupsComponent } from '../../../../services/context/popups-context'; import { sanitizeQueryUrl } from '../../../../utils/query-url-sanitization'; import { translateMessage } from '../../../../utils/translate-messages'; import { copy } from '../../../common/copy'; -import { CopyButton } from '../../../common/copy/CopyButton'; import { createShareLink } from '../../../common/share'; - +import { CopyButton } from '../../../common/lazy-loader/component-registry'; const ShareQuery: React.FC> = (props) => { diff --git a/src/app/views/query-runner/request/Request.tsx b/src/app/views/query-runner/request/Request.tsx index c0017a5b4d..68e14121a1 100644 --- a/src/app/views/query-runner/request/Request.tsx +++ b/src/app/views/query-runner/request/Request.tsx @@ -1,4 +1,8 @@ -import { FontSizes, Pivot, PivotItem } from '@fluentui/react'; +import { + FontSizes, + Pivot, + PivotItem +} from '@fluentui/react'; import { Resizable } from 're-resizable'; import { CSSProperties, useEffect, useState } from 'react'; import { injectIntl } from 'react-intl'; @@ -10,11 +14,9 @@ import { Mode } from '../../../../types/enums'; import { setDimensions } from '../../../services/actions/dimensions-action-creator'; import { translateMessage } from '../../../utils/translate-messages'; import { convertPxToVh, convertVhToPx } from '../../common/dimensions/dimensions-adjustment'; -import { Auth } from './auth'; import { RequestBody } from './body'; -import { RequestHeaders } from './headers'; -import { Permissions } from './permissions'; import './request.scss'; +import { Permissions, Auth, RequestHeaders } from '../../common/lazy-loader/component-registry'; const Request = (props: any) => { const dispatch: AppDispatch = useDispatch(); @@ -106,7 +108,7 @@ const Request = (props: any) => {
- , + ); } diff --git a/src/app/views/query-runner/request/auth/Auth.tsx b/src/app/views/query-runner/request/auth/Auth.tsx index 849a67b861..33a2c6d54e 100644 --- a/src/app/views/query-runner/request/auth/Auth.tsx +++ b/src/app/views/query-runner/request/auth/Auth.tsx @@ -10,7 +10,7 @@ import { ACCOUNT_TYPE } from '../../../../services/graph-constants'; import { translateMessage } from '../../../../utils/translate-messages'; import { classNames } from '../../../classnames'; import { trackedGenericCopy } from '../../../common/copy'; -import { CopyButton } from '../../../common/copy/CopyButton'; +import { CopyButton } from '../../../common/lazy-loader/component-registry'; import { convertVhToPx } from '../../../common/dimensions/dimensions-adjustment'; import { authStyles } from './Auth.styles'; diff --git a/src/app/views/query-runner/request/auth/index.ts b/src/app/views/query-runner/request/auth/index.ts index f9edf42412..e2737e7588 100644 --- a/src/app/views/query-runner/request/auth/index.ts +++ b/src/app/views/query-runner/request/auth/index.ts @@ -1,3 +1,3 @@ -import Auth from './Auth'; +import { Auth } from './Auth'; -export { Auth }; +export default Auth; diff --git a/src/app/views/query-runner/request/headers/index.ts b/src/app/views/query-runner/request/headers/index.ts index 4e19f50bb7..4ea53ad894 100644 --- a/src/app/views/query-runner/request/headers/index.ts +++ b/src/app/views/query-runner/request/headers/index.ts @@ -1,5 +1,3 @@ import RequestHeaders from './RequestHeaders'; -export { - RequestHeaders -}; \ No newline at end of file +export default RequestHeaders; \ No newline at end of file diff --git a/src/app/views/query-runner/request/permissions/index.ts b/src/app/views/query-runner/request/permissions/index.ts index 593715678e..1ce7043d1b 100644 --- a/src/app/views/query-runner/request/permissions/index.ts +++ b/src/app/views/query-runner/request/permissions/index.ts @@ -1,5 +1,3 @@ import { Permissions } from './Permissions.Query'; -export { - Permissions -}; +export default Permissions; \ No newline at end of file diff --git a/src/app/views/sidebar/Sidebar.tsx b/src/app/views/sidebar/Sidebar.tsx index 7a773f7be3..e5d67f6569 100644 --- a/src/app/views/sidebar/Sidebar.tsx +++ b/src/app/views/sidebar/Sidebar.tsx @@ -1,15 +1,19 @@ import { - DirectionalHint, FontSizes, getTheme, IconButton, - Pivot, PivotItem, Stack, TooltipDelay, TooltipHost + DirectionalHint, + FontSizes, + getTheme, + IconButton, + Pivot, + PivotItem, + Stack, + TooltipDelay, + TooltipHost } from '@fluentui/react'; - import { telemetry } from '../../../telemetry'; import { translateMessage } from '../../utils/translate-messages'; -import { History } from './history'; -import { ResourceExplorer } from './resource-explorer'; import SampleQueries from './sample-queries/SampleQueries'; import { sidebarStyles } from './Sidebar.styles'; - +import { ResourceExplorer, History } from '../common/lazy-loader/component-registry'; interface ISidebar { currentTab: string; setSidebarTabSelection: Function; @@ -17,6 +21,7 @@ interface ISidebar { toggleSidebar: Function; mobileScreen: boolean; } + export const Sidebar = (props: ISidebar) => { const theme = getTheme(); const styles = sidebarStyles(theme).sidebarButtons; diff --git a/src/app/views/sidebar/resource-explorer/index.ts b/src/app/views/sidebar/resource-explorer/index.ts index a389534228..e6c967647e 100644 --- a/src/app/views/sidebar/resource-explorer/index.ts +++ b/src/app/views/sidebar/resource-explorer/index.ts @@ -1,2 +1,2 @@ import ResourceExplorer from './ResourceExplorer'; -export { ResourceExplorer }; \ No newline at end of file +export default ResourceExplorer; \ No newline at end of file diff --git a/src/messages/GE.json b/src/messages/GE.json index 53c63dae2e..26f4362e47 100644 --- a/src/messages/GE.json +++ b/src/messages/GE.json @@ -473,6 +473,7 @@ "Query documentation": "Query documentation", "This token is not a jwt token and cannot be decoded by jwt.ms": "This token is not a jwt token and cannot be decoded by jwt.ms", "The URL must contain graph.microsoft.com": "The URL must contain graph.microsoft.com", + "Something went wrong": "Something went wrong while downloading this tab. Please try again", "Query documentation not found": "Query documentation not found", "Fetching code snippet failing": "Retry again", "Fetching permissions failing": "Retry again",