New story for offset example. Fix onHide

department-of-veterans-affairs · Aug 7, 2024 · 347cf66 · 347cf66
1 parent b40af77
commit 347cf66
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 15 deletions.
diff --git a/packages/components/src/components/Snackbar/Snackbar.stories.tsx b/packages/components/src/components/Snackbar/Snackbar.stories.tsx
@@ -35,41 +35,50 @@ export default meta
 
 type Story = StoryObj<SnackbarProps>
 
+const isWeb = Platform.OS !== 'web'
+
 const mobileComponentRenderer = (props: SnackbarProps) => {
-  const { isError, messageA11y, onActionPressed } = props.data || {}
+  const { isError, messageA11y, onActionPressed, offset } = props.data || {}
   const { show } = useSnackbar()
-  const onPressSnackbarOffset = () => {
-    show(props.message as string, {
-      isError,
-      messageA11y,
-      onActionPressed,
-      offset: 500,
-    })
-  }
-
   const onPressSnackbar = () => {
     show(props.message as string, {
       isError,
       messageA11y,
       onActionPressed,
+      offset,
     })
   }
+
   return (
     <>
-      <Button label="500 Offset" onPress={onPressSnackbarOffset} />
-      <Button label="Default Offset" onPress={onPressSnackbar} />
+      <Button label="Press for Snackbar" onPress={onPressSnackbar} />
     </>
   )
 }
 
 export const _Snackbar: Story = {
-  render: Platform.OS !== 'web' ? mobileComponentRenderer : undefined, // Render Snackbar flat in web
+  name: 'Default',
+  render: isWeb ? mobileComponentRenderer : undefined, // Render Snackbar flat in web
+  args: {
+    message: 'Message moved to Test Folder',
+    data: {
+      isError: false,
+      messageA11y: 'Message moved to Custom Folder with a11y',
+      onActionPressed: () => console.log('Action pressed'),
+    },
+  },
+}
+
+export const __SnackbarWithCustomOffset: Story = {
+  name: 'Custom offset',
+  render: isWeb ? mobileComponentRenderer : undefined, // Render Snackbar flat in web
   args: {
     message: 'Message moved to Test Folder',
     data: {
       isError: false,
       messageA11y: 'Message moved to Custom Folder with a11y',
       onActionPressed: () => console.log('Action pressed'),
+      offset: 200,
     },
   },
 }
diff --git a/packages/components/src/components/Snackbar/Snackbar.tsx b/packages/components/src/components/Snackbar/Snackbar.tsx
@@ -195,7 +195,7 @@ export const Snackbar: FC<SnackbarProps> = (toast) => {
 
     const onPress = () => {
       onActionPressed()
-      toast.toast.onHide()
+      toast.onHide()
     }
     const actionText = isError ? t('tryAgain') : t('undo')
 

diff --git a/packages/components/src/components/Snackbar/SnackbarProvider.tsx b/packages/components/src/components/Snackbar/SnackbarProvider.tsx
@@ -8,7 +8,6 @@ type SnackbarContextType = {
   setOffset: (newOffset: number) => void
 }
 
-// Create the context without default values
 export const SnackbarContext = createContext<SnackbarContextType | undefined>(
   undefined,
 )