Fixing formatting issues

.github/workflows/frontend-test.yml

@@ -13,9 +13,6 @@ jobs:
       - name: 🛎 Checkout
         uses: actions/checkout@v3
 
-      - name: 🔧 Install yarn
-        run: npm install -g yarn prettier
-
       - name: Get yarn cache path
         id: yarn-cache-dir-path
         run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
@@ -30,9 +27,7 @@ jobs:
         run: yarn
 
       - name: Check lint
-        run: |
-          yarn lint --max-warnings=0
-          prettier --check "src/**/*.(tsx|ts)"
+        run: yarn lint
 
       - name: Pretend we have data.json and run tests
         run: cp public/test-file.json public/data.json && yarn test

.prettierrc.json

@@ -1 +1,3 @@
-{}
+{
+    "trailingComma": "all"
+}

package.json

@@ -30,7 +30,7 @@
     "predeploy": "npm run build",
     "deploy": "gh-pages -d build",
     "test": "react-scripts test",
-    "lint": "eslint src/**/*.{ts,tsx}",
+    "lint": "eslint src/**/*.{ts,tsx} --max-warnings=0 && prettier --check 'src/**/*.(tsx|ts)'",
     "prettier": "prettier --write 'src/**/*.(tsx|ts)'",
     "eject": "react-scripts eject"
   },

src/components/FAQ.tsx

@@ -38,9 +38,9 @@ export const FAQ = () => (
           <p>
             Polkadot Vault is a cold storage solution that turns your iOS or
             Android device into a dedicated hardware wallet for Polkadot,
-            Frequency, and other Substrate-based chains. Your keys are kept secure
-            (i.e. offline) at all times, and transactions are signed in an
-            air-gapped way via QR-codes.
+            Frequency, and other Substrate-based chains. Your keys are kept
+            secure (i.e. offline) at all times, and transactions are signed in
+            an air-gapped way via QR-codes.
           </p>
         </Disclosure.Panel>
       </Disclosure>

src/components/NetworkSelectMobile.tsx

@@ -40,11 +40,13 @@ export const NetworkSelectMobile = ({
                   <div
                     className={cn(
                       "flex items-center space-x-2 px-2 py-1",
-                      selected && "bg-neutral-100 rounded-full"
+                      selected && "bg-neutral-100 rounded-full",
                     )}
                   >
                     <img src={icon(chain)} className="w-8 rounded-full" />
-                    <div className="text-xl">{formatTitle(chains[chain].title)}</div>
+                    <div className="text-xl">
+                      {formatTitle(chains[chain].title)}
+                    </div>
                   </div>
                 )}
               </Listbox.Option>