From 1c0d212a22870fcfb6ec68c8dda0ee60af9de1d4 Mon Sep 17 00:00:00 2001
From: Justin Campbell <campb303@purdue.edu>
Date: Mon, 19 Apr 2021 00:15:57 -0400
Subject: [PATCH] Update TimelineActionCard stories

---
 .../TimelineActionCard.stories.mdx            | 69 ++++++++++++-------
 1 file changed, 45 insertions(+), 24 deletions(-)

diff --git a/src/components/TimelineActionCard/TimelineActionCard.stories.mdx b/src/components/TimelineActionCard/TimelineActionCard.stories.mdx
index 8712f6e..9831a58 100644
--- a/src/components/TimelineActionCard/TimelineActionCard.stories.mdx
+++ b/src/components/TimelineActionCard/TimelineActionCard.stories.mdx
@@ -1,41 +1,62 @@
-import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
+import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs/blocks';
 import TimelineActionCard from "./TimelineActionCard";
 
+<Meta 
+    title="Components/TimelineActionCard" 
+    component={TimelineActionCard}
+    argTypes={{
+        datetime: {
+            control: {
+                type: "date"
+            }
+        },
+        content: {
+            control: {
+                type: "object"
+            }
+        }
+    }}
+/>
 
 Renders a card like view for an action with free form text content like an Edit or Reply.
 
-<Meta title="Components/TimelineActionCard" component={TimelineActionCard}/>
-
 # Edit
 
 <Canvas>
-  <Story name="Edit" args={{
-      type:"edit",
-      datetime:"2020-06-23T13:27:56",
-      by:"campb303",
-      content:[
-                    "This be an edit my boy\n"
-        ]
-  }}>
-     {args => <TimelineActionCard {...args} />}
+    <Story 
+        name="Edit" 
+        args={{
+            type:"edit",
+            datetime:"2020-06-23T13:27:56",
+            by:"campb303",
+            content:[
+                "This be an edit my boy\n"
+            ]
+        }}
+    >
+        { args => <TimelineActionCard {...args} /> }
     </Story>
 </Canvas>
 
 # Reply
 
 <Canvas>
-  <Story name="Reply to User" args={{
-      type:"reply_to_user",
-      datetime:"2020-06-23T13:28:18",
-      by:"campb303",
-      content:[
-                    "This be a reply my son\n",
-                    "\n",
-                    "Justin\n",
-                    "ECN\n"
-                ]
-  }}>
-     {args => <TimelineActionCard {...args} />}
+    <Story 
+        name="Reply to User" 
+        args={{
+            type:"reply_to_user",
+            datetime:"2020-06-23T13:28:18",
+            by:"campb303",
+            content:[
+                "This be a reply my son\n",
+                "\n",
+                "Justin\n",
+                "ECN\n"
+            ]
+        }}
+    >
+        { args => <TimelineActionCard {...args} /> }
     </Story>
 </Canvas>
 
+<ArgsTable of={TimelineActionCard} />
\ No newline at end of file