diff --git a/desktop/app/src/chrome/SettingsSheet.tsx b/desktop/app/src/chrome/SettingsSheet.tsx index bb1958e3e..c4d1b9383 100644 --- a/desktop/app/src/chrome/SettingsSheet.tsx +++ b/desktop/app/src/chrome/SettingsSheet.tsx @@ -247,7 +247,7 @@ class SettingsSheet extends Component { /> {!disableSandy && ( { this.setState((prevState) => ({ diff --git a/desktop/app/src/sandy-chrome/SandyApp.tsx b/desktop/app/src/sandy-chrome/SandyApp.tsx index ae4dcee6e..397d6775f 100644 --- a/desktop/app/src/sandy-chrome/SandyApp.tsx +++ b/desktop/app/src/sandy-chrome/SandyApp.tsx @@ -31,6 +31,7 @@ import {ContentContainer} from './ContentContainer'; import {Notification} from './notification/Notification'; import {SheetRenderer} from '../chrome/SheetRenderer'; import {hasNewChangesToShow} from '../chrome/ChangelogSheet'; +import {SandyWelcomScreen} from './SandyWelcomeScreen'; export type ToplevelNavItem = | 'appinspect' @@ -104,6 +105,7 @@ export function SandyApp({logger}: {logger: Logger}) { <> + diff --git a/desktop/app/src/sandy-chrome/SandyWelcomeScreen.tsx b/desktop/app/src/sandy-chrome/SandyWelcomeScreen.tsx new file mode 100644 index 000000000..728fecb5e --- /dev/null +++ b/desktop/app/src/sandy-chrome/SandyWelcomeScreen.tsx @@ -0,0 +1,102 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * + * @format + */ + +import {BugOutlined, SettingOutlined} from '@ant-design/icons'; +import {Modal, Button, Checkbox, Typography} from 'antd'; +import React, {useState} from 'react'; +import constants from '../fb-stubs/constants'; +import {NUX, Layout, theme} from 'flipper-plugin'; +import {useLocalStorage} from '../utils/useLocalStorage'; + +const {Title, Text, Link} = Typography; + +export function SandyWelcomScreen() { + const [dismissed, setDismissed] = useState(false); + const [showWelcomeScreen, setShowWelcomeScreen] = useLocalStorage( + 'flipper-sandy-show-welcome-screen', + true, + ); + const [dontShowNextTime, setDontShowNextTime] = useState(true); + return ( + { + setDismissed(true); + }} + footer={ + <> + { + setDontShowNextTime(e.target.value); + }}> + Don't show this dialog in the future + + + + }> + + Welcome to the new Flipper design + + Flipper has a fresh look and feel! It should provide a smoother, more + intuitive experience. So make sure to check out the{' '} + + + {' '} + to find new or improved features. + + + It is possible to enable the experimental dark mode, or switch back to + the old design, by using the{' '} +