diff --git a/frontend/src/component/personalDashboard/PersonalDashboard.tsx b/frontend/src/component/personalDashboard/PersonalDashboard.tsx index 6e5f6c9d7d66..30cd5bddbf06 100644 --- a/frontend/src/component/personalDashboard/PersonalDashboard.tsx +++ b/frontend/src/component/personalDashboard/PersonalDashboard.tsx @@ -31,17 +31,12 @@ import { RoleAndOwnerInfo } from './RoleAndOwnerInfo'; import { ContentGridNoProjects } from './ContentGridNoProjects'; import { LatestProjectEvents } from './LatestProjectEvents'; import { usePersonalDashboardProjectDetails } from 'hooks/api/getters/usePersonalDashboard/usePersonalDashboardProjectDetails'; +import HelpOutline from '@mui/icons-material/HelpOutline'; -const ScreenExplanation = styled(Typography)(({ theme }) => ({ - marginTop: theme.spacing(1), - marginBottom: theme.spacing(8), - maxWidth: theme.spacing(45), -})); - -const StyledHeaderTitle = styled(Typography)(({ theme }) => ({ - fontSize: theme.typography.h2.fontSize, - fontWeight: 'normal', - marginBottom: theme.spacing(2), +const ScreenExplanation = styled('div')(({ theme }) => ({ + marginBottom: theme.spacing(4), + display: 'flex', + alignItems: 'center', })); const ContentGrid = styled(Grid)(({ theme }) => ({ @@ -196,8 +191,8 @@ export const PersonalDashboard = () => { const stage = activeProjectOverview?.onboardingStatus.status ?? 'loading'; const [welcomeDialog, setWelcomeDialog] = useLocalStorageState< - 'seen' | 'not_seen' - >('welcome-dialog:v1', 'not_seen'); + 'open' | 'closed' + >('welcome-dialog:v1', 'open'); const noProjects = projects.length === 0; @@ -207,10 +202,19 @@ export const PersonalDashboard = () => { Welcome {name} - Here are some tasks we think would be useful in order to get the - most of Unleash +

+ Here are some tasks we think would be useful in order to get + the most out of Unleash +

+ setWelcomeDialog('open')} + > + +
- Your resources + {noProjects ? ( { setWelcomeDialog('seen')} + open={welcomeDialog === 'open'} + onClose={() => setWelcomeDialog('closed')} /> );