Formatting cleanup

Author: hunterjam

frontend/src/pages/draft/Draft.tsx

@@ -1,22 +1,21 @@
-import React, { useState, useContext } from 'react';
+import React, { useState, useContext } from 'react'
 import styles from './Draft.module.css'
-import { useLocation } from 'react-router-dom';
+import { useLocation } from 'react-router-dom'
 import TitleCard from '../../components/DraftCards/TitleCard'
 import SectionCard from '../../components/DraftCards/SectionCard'
-import { Document, Packer, Paragraph, TextRun } from 'docx';
-import { saveAs } from 'file-saver';
-import { AppStateContext } from "../../state/AppProvider";
-import { CommandBarButton, Stack } from '@fluentui/react';
-
+import { Document, Packer, Paragraph, TextRun } from 'docx'
+import { saveAs } from 'file-saver'
+import { AppStateContext } from '../../state/AppProvider'
+import { CommandBarButton, Stack } from '@fluentui/react'
 
 const Draft = (): JSX.Element => {
   const appStateContext = useContext(AppStateContext)
-  const location = useLocation();
-  const [title, setTitle] = useState('');
+  const location = useLocation()
+  const [title, setTitle] = useState('')
 
   // get draftedDocument from context
-  const draftedDocument = appStateContext?.state.draftedDocument;
-  const sections = draftedDocument?.sections ?? [];
+  const draftedDocument = appStateContext?.state.draftedDocument
+  const sections = draftedDocument?.sections ?? []
 
   const exportToWord = () => {
     const doc = new Document({
@@ -29,51 +28,54 @@ const Draft = (): JSX.Element => {
                 new TextRun({
                   text: title,
                   bold: true,
-                  size: 24,
+                  size: 24
                 }),
                 new TextRun({
-                  text: "\n",
-                  break: 1, // Add a new line after the title
-                }),              ],
+                  text: '\n',
+                  break: 1 // Add a new line after the title
+                })
+              ]
             }),
-            ...sections.map((section, index) => (
-              new Paragraph({
-                children: [
-                  new TextRun({
-                    text: `Section ${index + 1}: ${section.title}`,
-                    bold: true,
-                    size: 20,
-                  }),
-                  new TextRun({
-                    text: "\n",
-                    break: 1, // Add a new line after the section title
-                  }),
-                  new TextRun({
-                    text: section.content,
-                    size: 16,
-                  }),
-                  new TextRun({
-                    text: "\n",
-                    break: 1, // Add a new line after the content
-                  }),                ],
-              })
-            )),
-          ],
-        },
-      ],
-    });
+            ...sections.map(
+              (section, index) =>
+                new Paragraph({
+                  children: [
+                    new TextRun({
+                      text: `Section ${index + 1}: ${section.title}`,
+                      bold: true,
+                      size: 20
+                    }),
+                    new TextRun({
+                      text: '\n',
+                      break: 1 // Add a new line after the section title
+                    }),
+                    new TextRun({
+                      text: section.content,
+                      size: 16
+                    }),
+                    new TextRun({
+                      text: '\n',
+                      break: 1 // Add a new line after the content
+                    })
+                  ]
+                })
+            )
+          ]
+        }
+      ]
+    })
 
     Packer.toBlob(doc).then(blob => {
-      saveAs(blob, `DraftTemplate-${sanitizeTitle(title)}.docx`);
-    });
-  };
+      saveAs(blob, `DraftTemplate-${sanitizeTitle(title)}.docx`)
+    })
+  }
 
   const handleTitleChange = (newTitle: string) => {
-    setTitle(newTitle);
-  };
+    setTitle(newTitle)
+  }
 
   function sanitizeTitle(title: string): string {
-    return title.replace(/[^a-zA-Z0-9]/g, '');
+    return title.replace(/[^a-zA-Z0-9]/g, '')
   }
 
   return (
@@ -83,31 +85,33 @@ const Draft = (): JSX.Element => {
       </div>
 
       <TitleCard onTitleChange={handleTitleChange} />
-      {(sections ?? []).map((_, index) => (<SectionCard key={index} sectionIdx={index} />))}
+      {(sections ?? []).map((_, index) => (
+        <SectionCard key={index} sectionIdx={index} />
+      ))}
       <Stack>
         <CommandBarButton
-                  role="button"
-                  styles={{
-                    icon: {
-                      color: '#FFFFFF'
-                    },
-                    iconDisabled: {
-                      color: '#BDBDBD !important'
-                    },
-                    root: {
-                      color: '#FFFFFF',
-                      background: '#1367CF'
-                    },
-                    rootDisabled: {
-                      background: '#F0F0F0'
-                    }
-                  }}
-                  className={styles.exportDocumentIcon}
-                  iconProps={{ iconName: 'WordDocument' }}
-                  onClick={exportToWord} //Update for Document Generation
-                  aria-label="export document"
-                  text="Export Document"
-                />
+          role="button"
+          styles={{
+            icon: {
+              color: '#FFFFFF'
+            },
+            iconDisabled: {
+              color: '#BDBDBD !important'
+            },
+            root: {
+              color: '#FFFFFF',
+              background: '#1367CF'
+            },
+            rootDisabled: {
+              background: '#F0F0F0'
+            }
+          }}
+          className={styles.exportDocumentIcon}
+          iconProps={{ iconName: 'WordDocument' }}
+          onClick={exportToWord}
+          aria-label="export document"
+          text="Export Document"
+        />
       </Stack>
     </div>
   )