diff --git a/src/plugins/navigation/components/SaveBookmarkDialog.js b/src/plugins/navigation/components/SaveBookmarkDialog.js new file mode 100644 index 000000000..057e328a7 --- /dev/null +++ b/src/plugins/navigation/components/SaveBookmarkDialog.js @@ -0,0 +1,82 @@ +/** + * Copyright 2018-present Facebook. + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * @format + * @flow strict-local + */ + +import {Button, FlexColumn, Input, Sheet, styled} from 'flipper'; + +type Props = {| + uri: ?string, + shouldShow: boolean, + onHide: ?() => void, + onSubmit: ?(uri: string) => void, +|}; + +const Container = styled(FlexColumn)({ + padding: 10, + width: 400, +}); + +const Title = styled('div')({ + fontWeight: '500', + marginTop: 8, + marginLeft: 2, + marginBottom: 8, +}); + +const URIContainer = styled('div')({ + marginLeft: 2, + marginBottom: 8, + overflowWrap: 'break-word', +}); + +const ButtonContainer = styled('div')({ + marginLeft: 'auto', +}); + +const NameInput = styled(Input)({ + margin: 0, + marginBottom: 10, + height: 30, +}); + +export default (props: Props) => { + const {shouldShow, onHide, onSubmit, uri} = props; + if (uri == null || !shouldShow) { + return null; + } else { + return ( + + {hide => { + return ( + + Save to bookmarks... + + {uri} + + + + + + ); + }} + + ); + } +}; diff --git a/src/plugins/navigation/components/index.js b/src/plugins/navigation/components/index.js index fc75d8861..831644d28 100644 --- a/src/plugins/navigation/components/index.js +++ b/src/plugins/navigation/components/index.js @@ -10,6 +10,7 @@ export {default as BookmarksSidebar} from './BookmarksSidebar'; export {default as FavoriteButton} from './FavoriteButton'; export {default as IconButton} from './IconButton'; export {default as NavigationInfoBox} from './NavigationInfoBox'; +export {default as SaveBookmarkDialog} from './SaveBookmarkDialog'; export {default as ScrollableFlexColumn} from './ScrollableFlexColumn'; export {default as SearchBar} from './SearchBar'; export {default as Timeline} from './Timeline';