diff options
author | Thomas F. K. Jorna <[email protected]> | 2021-10-05 12:35:40 +0200 |
---|---|---|
committer | Thomas F. K. Jorna <[email protected]> | 2021-10-05 12:35:40 +0200 |
commit | 33839479e269bed905f9eefc374060b9d3ee7e19 (patch) | |
tree | f628200a10e5e37aa00f05cea2464eaf67df9581 /components | |
parent | b0ddf286f087b31dc75626f709cfce3889de25dd (diff) |
feat(preview): filesystem basics in place
Diffstat (limited to 'components')
-rw-r--r-- | components/BehaviorPanel.tsx | 0 | ||||
-rw-r--r-- | components/Sidebar/Link.tsx | 11 | ||||
-rw-r--r-- | components/Sidebar/index.tsx | 5 | ||||
-rw-r--r-- | components/Tweaks/BehaviorPanel.tsx | 17 |
4 files changed, 33 insertions, 0 deletions
diff --git a/components/BehaviorPanel.tsx b/components/BehaviorPanel.tsx new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/components/BehaviorPanel.tsx diff --git a/components/Sidebar/Link.tsx b/components/Sidebar/Link.tsx new file mode 100644 index 0000000..789873a --- /dev/null +++ b/components/Sidebar/Link.tsx @@ -0,0 +1,11 @@ +import { Text } from '@chakra-ui/react' + +export interface LinkProps { + id: string +} + +export const Link = (props: LinkProps) => { + const { id } = props + + return <Text>{id}</Text> +} diff --git a/components/Sidebar/index.tsx b/components/Sidebar/index.tsx index 05f5720..4f314da 100644 --- a/components/Sidebar/index.tsx +++ b/components/Sidebar/index.tsx @@ -51,6 +51,11 @@ const Sidebar = (props: SidebarProps) => { console.log(res) setPreviewText(res) }) + .catch((e) => { + setPreviewText( + 'Could not fetch the text for some reason, sorry!\n\n This can happen because you have an id with forward slashes (/) in it.', + ) + }) } useEffect(() => { diff --git a/components/Tweaks/BehaviorPanel.tsx b/components/Tweaks/BehaviorPanel.tsx index 0c22e1a..27906c5 100644 --- a/components/Tweaks/BehaviorPanel.tsx +++ b/components/Tweaks/BehaviorPanel.tsx @@ -10,12 +10,15 @@ import { StackDivider, VStack, Text, + Box, } from '@chakra-ui/react' import React from 'react' import { initialBehavior, initialMouse } from '../config' import { InfoTooltip } from './InfoTooltip' import { SliderWithInfo } from './SliderWithInfo' +import { checkFileSystemCompatibility } from '../../util/checkFileSystemCompatibility' + export interface BehaviorPanelProps { behavior: typeof initialBehavior setBehavior: any @@ -163,6 +166,20 @@ export const BehaviorPanel = (props: BehaviorPanelProps) => { onChange={(value) => setBehavior({ ...behavior, zoomPadding: value })} infoText="How much to zoom out to accomodate all nodes when changing the view." /> + + <Box> + <Button width="100%" isDisabled={!checkFileSystemCompatibility()}> + Grant Filesystem Access + </Button> + {!checkFileSystemCompatibility() && ( + <Box bg="gray.600" width="100%" padding={5}> + <Text> + You are not using a browser compatible with the FileSystem Access API. Only Chromium + based browsers are currently supported. + </Text> + </Box> + )} + </Box> </VStack> ) } |