Skip to content

Commit 02578e8

Browse files
djechlin-mongodbdjechlin-mongodb
committed
use persisted storage
1 parent 5481015 commit 02578e8

File tree

2 files changed

+65
-64
lines changed

2 files changed

+65
-64
lines changed

‎packages/compass-indexes/src/components/indexes/indexes.tsx‎

Lines changed: 30 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
WorkspaceContainer,
88
css,
99
spacing,
10+
usePersistedState,
1011
} from '@mongodb-js/compass-components';
1112

1213
import IndexesToolbar from '../indexes-toolbar/indexes-toolbar';
@@ -49,38 +50,40 @@ const containerStyles = css({
4950

5051
const linkTitle = 'Atlas Search.';
5152

52-
const DIMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY =
53+
const DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY =
5354
'mongodb_compass_dismissedSearchIndexesBanner' as const;
5455

5556
const AtlasIndexesBanner = ({ namespace }: { namespace: string }) => {
5657
const { atlasMetadata } = useConnectionInfo();
5758
if (!atlasMetadata) {
5859
return null;
5960
}
60-
const onClose = () => {
61-
localStorage.setItem(
62-
DIMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY,
63-
'true'
64-
);
65-
};
61+
62+
const [dismissed, setDismissed] = usePersistedState(
63+
DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY,
64+
false
65+
);
66+
6667
return (
67-
<Banner variant="info" dismissible onClose={onClose}>
68-
<Body weight="medium">Looking for search indexes?</Body>
69-
These indexes can be created and viewed under{' '}
70-
{atlasMetadata ? (
71-
<Link
72-
href={getAtlasSearchIndexesLink({
73-
clusterName: atlasMetadata.clusterName,
74-
namespace,
75-
})}
76-
hideExternalIcon
77-
>
78-
{linkTitle}
79-
</Link>
80-
) : (
81-
linkTitle
82-
)}
83-
</Banner>
68+
!dismissed && (
69+
<Banner variant="info" dismissible onClose={() => setDismissed(true)}>
70+
<Body weight="medium">Looking for search indexes?</Body>
71+
These indexes can be created and viewed under{' '}
72+
{atlasMetadata ? (
73+
<Link
74+
href={getAtlasSearchIndexesLink({
75+
clusterName: atlasMetadata.clusterName,
76+
namespace,
77+
})}
78+
hideExternalIcon
79+
>
80+
{linkTitle}
81+
</Link>
82+
) : (
83+
linkTitle
84+
)}
85+
</Banner>
86+
)
8487
);
8588
};
8689

@@ -150,11 +153,9 @@ export function Indexes({
150153
}
151154
>
152155
<div className={indexesContainersStyles}>
153-
{!isReadonlyView &&
154-
!enableAtlasSearchIndexes &&
155-
localStorage.getItem(
156-
DIMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY
157-
) !== 'true' && <AtlasIndexesBanner namespace={namespace} />}
156+
{!isReadonlyView && !enableAtlasSearchIndexes && (
157+
<AtlasIndexesBanner namespace={namespace} />
158+
)}
158159
{!isReadonlyView && currentIndexesView === 'regular-indexes' && (
159160
<RegularIndexesTable />
160161
)}

‎packages/compass-schema/src/components/compass-schema.tsx‎

Lines changed: 35 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
spacing,
2323
useDarkMode,
2424
WorkspaceContainer,
25+
usePersistedState,
2526
lighten,
2627
Banner,
2728
Body,
@@ -74,9 +75,6 @@ const insightsBadgeStyles = css({
7475
verticalAlign: 'middle',
7576
});
7677

77-
const DISMISSED_PERFORMANCE_ADVISOR_BANNER_LOCAL_STORAGE_KEY =
78-
'mongodb_compass_dismissedPerformanceAdvisorBanner' as const;
79-
8078
const minichartStyles = (darkMode: boolean) => {
8179
const mcBlue0 = palette.blue.light1;
8280
const mcBlue1 = lighten(0.075, mcBlue0);
@@ -301,6 +299,9 @@ const AnalyzingScreen: React.FunctionComponent<{
301299
);
302300
};
303301

302+
const DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY =
303+
'mongodb_compass_dismissedSearchIndexesBanner' as const;
304+
304305
const FieldList: React.FunctionComponent<{
305306
schema: MongodbSchema | null;
306307
analysisState: AnalysisState;
@@ -344,35 +345,37 @@ const title = 'Atlas’ Performance Advisor.';
344345
const PerformanceAdvisorBanner = () => {
345346
const connectionInfo = useConnectionInfo();
346347
const track = useTelemetry();
347-
const onClose = () => {
348-
localStorage.setItem(
349-
DISMISSED_PERFORMANCE_ADVISOR_BANNER_LOCAL_STORAGE_KEY,
350-
'true'
351-
);
352-
};
348+
349+
const [dismissed, setDismissed] = usePersistedState(
350+
DISMISSED_SEARCH_INDEXES_BANNER_LOCAL_STORAGE_KEY,
351+
false
352+
);
353+
353354
return (
354-
<Banner variant="info" dismissible onClose={onClose}>
355-
<Body weight="medium">Looking for schema anti-patterns?</Body>
356-
In its place, you may refer to Data Explorer’s performance insights{' '}
357-
<Badge className={insightsBadgeStyles} variant="blue">
358-
<Icon glyph="Bulb" size="small" />
359-
Insight
360-
</Badge>
361-
{nbsp}or{nbsp}
362-
{connectionInfo.atlasMetadata ? (
363-
<Link
364-
href={getAtlasPerformanceAdvisorLink(connectionInfo.atlasMetadata)}
365-
onClick={() =>
366-
track('Performance Advisor Clicked', {}, connectionInfo)
367-
}
368-
hideExternalIcon
369-
>
370-
{title}
371-
</Link>
372-
) : (
373-
title
374-
)}
375-
</Banner>
355+
!dismissed && (
356+
<Banner variant="info" dismissible onClose={() => setDismissed(true)}>
357+
<Body weight="medium">Looking for schema anti-patterns?</Body>
358+
In its place, you may refer to Data Explorer’s performance insights{' '}
359+
<Badge className={insightsBadgeStyles} variant="blue">
360+
<Icon glyph="Bulb" size="small" />
361+
Insight
362+
</Badge>
363+
{nbsp}or{nbsp}
364+
{connectionInfo.atlasMetadata ? (
365+
<Link
366+
href={getAtlasPerformanceAdvisorLink(connectionInfo.atlasMetadata)}
367+
onClick={() =>
368+
track('Performance Advisor Clicked', {}, connectionInfo)
369+
}
370+
hideExternalIcon
371+
>
372+
{title}
373+
</Link>
374+
) : (
375+
title
376+
)}
377+
</Banner>
378+
)
376379
);
377380
};
378381

@@ -422,10 +425,7 @@ const Schema: React.FunctionComponent<{
422425
}
423426
>
424427
<div className={contentStyles}>
425-
{enablePerformanceAdvisorBanner &&
426-
localStorage.getItem(
427-
DISMISSED_PERFORMANCE_ADVISOR_BANNER_LOCAL_STORAGE_KEY
428-
) !== 'true' && <PerformanceAdvisorBanner />}
428+
{enablePerformanceAdvisorBanner && <PerformanceAdvisorBanner />}
429429
{analysisState === ANALYSIS_STATE_INITIAL && (
430430
<InitialScreen onApplyClicked={onApplyClicked} />
431431
)}

0 commit comments

Comments
 (0)