jens/flipper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add changelog button to welcome screen

Browse Source 
Summary:
## Overall goal
Decouple top menu from electron

## Approach

We have two options to solve it:

1. Leave the menu as-is for electron. Add a new menu to the left nav for other target envs.
2. Add a new menu to the left nav for all target envs. Leave only electron-specific options in the electron top menu.

This stack of diffs (D32311662, D32316987, D32329804, TDB) implements the second option. The primary reason is to have unified user-experience. If our users on different platforms have the same experience, it is easier for us to propagate knowledge and debug issues.

## Implementation plan

1. Move changelog to the welcome screen (D32311662)
2. Move import/export functionality to a dedicated menu in the left nav (D32316987)
3. Move plugin actions button to the toolbox with screen recording buttons (D32329804)
4. Collapse some left rail items under a single menu (D32356865)
5. Clean up the rest of electron menu items (D32357953)

## Followup

Return to re-grouping of the left rail buttons and toggles after decapitation

Reviewed By: mweststrate

Differential Revision: D32311662

fbshipit-source-id: e2c4bc1a7bd2c167335fcd6d76276ae7c4947859
This commit is contained in:
Andrey Goncharov
2021-11-12 07:12:18 -08:00
committed by Facebook GitHub Bot
parent 34a09a3096
commit 32f722264f
1 changed files with 19 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
desktop/app/src/sandy-chrome/WelcomeScreen.tsx
View File

@@ -9,14 +9,15 @@
import React, {cloneElement} from 'react'; import React, {cloneElement} from 'react';
import {styled, FlexRow, FlexColumn} from '../ui'; import {styled, FlexRow, FlexColumn} from '../ui';
import {Modal, Button, Image, Checkbox, Space, Typography} from 'antd'; import {Modal, Button, Image, Checkbox, Space, Typography, Tooltip} from 'antd';
import { import {
RocketOutlined, RocketOutlined,
AppstoreAddOutlined, AppstoreAddOutlined,
CodeOutlined, CodeOutlined,
BugOutlined, BugOutlined,
HistoryOutlined,
} from '@ant-design/icons'; } from '@ant-design/icons';
import {Layout, theme, Tracked, TrackingScope} from 'flipper-plugin'; import {Dialog, Layout, theme, Tracked, TrackingScope} from 'flipper-plugin';
const {Text, Title} = Typography; const {Text, Title} = Typography;
@@ -26,6 +27,7 @@ import isProduction from '../utils/isProduction';
import {getAppVersion} from '../utils/info'; import {getAppVersion} from '../utils/info';
import ReleaseChannel from '../ReleaseChannel'; import ReleaseChannel from '../ReleaseChannel';
import {getFlipperLib} from 'flipper-plugin'; import {getFlipperLib} from 'flipper-plugin';
import ChangelogSheet from '../chrome/ChangelogSheet';
const RowContainer = styled(FlexRow)({ const RowContainer = styled(FlexRow)({
alignItems: 'flex-start', alignItems: 'flex-start',
@@ -173,9 +175,21 @@ function WelcomeScreenContent() {
{config.getReleaseChannel()} {config.getReleaseChannel()}
</code> </code>
</Text> </Text>
<Text style={{color: theme.textColorPlaceholder}}> <Space direction="horizontal" size="middle">
{isProduction() ? `Version ${getAppVersion()}` : 'Development Mode'} <Text style={{color: theme.textColorPlaceholder}}>
</Text> {isProduction() ? `Version ${getAppVersion()}` : 'Development Mode'}
</Text>
<Tooltip title="Changelog" placement="bottom">
<Button
size="small"
icon={<HistoryOutlined />}
title="Changelog"
onClick={() =>
Dialog.showModal((onHide) => <ChangelogSheet onHide={onHide} />)
}
/>
</Tooltip>
</Space>
</Space> </Space>
<Space direction="vertical" size="large" style={{width: '100%'}}> <Space direction="vertical" size="large" style={{width: '100%'}}>
<Row <Row