style(dashboard-v2): update prettier config

packages/dashboard-v2/.eslintrc.js

@@ -2,5 +2,5 @@ module.exports = {
   globals: {
     __PATH_PREFIX__: true,
   },
-  extends: 'react-app',
-}
+  extends: "react-app",
+};

packages/dashboard-v2/.prettierrc.json

@@ -1,5 +1,3 @@
 {
-  "semi": false,
-  "singleQuote": true,
   "printWidth": 120
 }

packages/dashboard-v2/gatsby-browser.js

@@ -1,13 +1,13 @@
-import * as React from 'react'
-import '@fontsource/sora/300.css' // light
-import '@fontsource/sora/400.css' // normal
-import '@fontsource/sora/500.css' // medium
-import '@fontsource/sora/600.css' // semibold
-import '@fontsource/source-sans-pro/400.css' // normal
-import '@fontsource/source-sans-pro/600.css' // semibold
-import './src/styles/global.css'
+import * as React from "react";
+import "@fontsource/sora/300.css"; // light
+import "@fontsource/sora/400.css"; // normal
+import "@fontsource/sora/500.css"; // medium
+import "@fontsource/sora/600.css"; // semibold
+import "@fontsource/source-sans-pro/400.css"; // normal
+import "@fontsource/source-sans-pro/600.css"; // semibold
+import "./src/styles/global.css";
 
 export function wrapPageElement({ element, props }) {
-  const Layout = element.type.Layout ?? React.Fragment
-  return <Layout {...props}>{element}</Layout>
+  const Layout = element.type.Layout ?? React.Fragment;
+  return <Layout {...props}>{element}</Layout>;
 }

packages/dashboard-v2/gatsby-config.js

@@ -4,28 +4,28 @@ module.exports = {
     siteUrl: `https://www.yourdomain.tld`,
   },
   plugins: [
-    'gatsby-plugin-image',
-    'gatsby-plugin-react-helmet',
-    'gatsby-plugin-sharp',
-    'gatsby-transformer-sharp',
-    'gatsby-plugin-postcss',
+    "gatsby-plugin-image",
+    "gatsby-plugin-react-helmet",
+    "gatsby-plugin-sharp",
+    "gatsby-transformer-sharp",
+    "gatsby-plugin-postcss",
     {
-      resolve: 'gatsby-source-filesystem',
+      resolve: "gatsby-source-filesystem",
       options: {
-        name: 'images',
-        path: './src/images/',
+        name: "images",
+        path: "./src/images/",
       },
-      __key: 'images',
+      __key: "images",
     },
     {
       resolve: `gatsby-plugin-alias-imports`,
       options: {
         alias: {
           // Allows npm link-ing skynet-storybook during development.
-          'styled-components': './node_modules/styled-components',
+          "styled-components": "./node_modules/styled-components",
         },
-        extensions: ['js'],
+        extensions: ["js"],
       },
     },
   ],
-}
+};

packages/dashboard-v2/postcss.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  plugins: [require('tailwindcss'), require('autoprefixer')],
-}
+  plugins: [require("tailwindcss"), require("autoprefixer")],
+};

packages/dashboard-v2/src/pages/404.js

@@ -1,28 +1,28 @@
-import * as React from 'react'
-import { Link } from 'gatsby'
+import * as React from "react";
+import { Link } from "gatsby";
 
 // styles
 const pageStyles = {
-  color: '#232129',
-  padding: '96px',
-  fontFamily: '-apple-system, Roboto, sans-serif, serif',
-}
+  color: "#232129",
+  padding: "96px",
+  fontFamily: "-apple-system, Roboto, sans-serif, serif",
+};
 const headingStyles = {
   marginTop: 0,
   marginBottom: 64,
   maxWidth: 320,
-}
+};
 
 const paragraphStyles = {
   marginBottom: 48,
-}
+};
 const codeStyles = {
-  color: '#8A6534',
+  color: "#8A6534",
   padding: 4,
-  backgroundColor: '#FFF4DB',
-  fontSize: '1.25rem',
+  backgroundColor: "#FFF4DB",
+  fontSize: "1.25rem",
   borderRadius: 4,
-}
+};
 
 // markup
 const NotFoundPage = () => {
@@ -31,13 +31,13 @@ const NotFoundPage = () => {
       <title>Not found</title>
       <h1 style={headingStyles}>Page not found</h1>
       <p style={paragraphStyles}>
-        Sorry{' '}
+        Sorry{" "}
         <span role="img" aria-label="Pensive emoji">
           😔
-        </span>{' '}
+        </span>{" "}
         we couldn’t find what you were looking for.
         <br />
-        {process.env.NODE_ENV === 'development' ? (
+        {process.env.NODE_ENV === "development" ? (
           <>
             <br />
             Try creating a page in <code style={codeStyles}>src/pages/</code>.
@@ -48,7 +48,7 @@ const NotFoundPage = () => {
         <Link to="/">Go home</Link>.
       </p>
     </main>
-  )
-}
+  );
+};
 
-export default NotFoundPage
+export default NotFoundPage;

packages/dashboard-v2/src/pages/files.js

@@ -1,8 +1,8 @@
-import * as React from 'react'
+import * as React from "react";
 
 // markup
 const FilesPage = () => {
-  return <>FILES</>
-}
+  return <>FILES</>;
+};
 
-export default FilesPage
+export default FilesPage;

packages/dashboard-v2/src/pages/index.js

@@ -1,8 +1,8 @@
-import * as React from 'react'
+import * as React from "react";
 
 // markup
 const IndexPage = () => {
-  return <>Dashboard</>
-}
+  return <>Dashboard</>;
+};
 
-export default IndexPage
+export default IndexPage;

packages/dashboard-v2/tailwind.config.js

@@ -1,57 +1,57 @@
-const defaultTheme = require('tailwindcss/defaultTheme')
-const plugin = require('tailwindcss/plugin')
+const defaultTheme = require("tailwindcss/defaultTheme");
+const plugin = require("tailwindcss/plugin");
 
 const colors = {
-  primary: { light: '#33D17E', DEFAULT: '#00c65e' },
-  warning: '#ffd567',
-  error: '#ED5454',
+  primary: { light: "#33D17E", DEFAULT: "#00c65e" },
+  warning: "#ffd567",
+  error: "#ED5454",
   palette: {
-    100: '#f5f7f7',
-    200: '#d4dddb',
-    300: '#9e9e9e',
-    400: '#555555',
-    500: '#242424',
-    600: '#0d0d0d',
+    100: "#f5f7f7",
+    200: "#d4dddb",
+    300: "#9e9e9e",
+    400: "#555555",
+    500: "#242424",
+    600: "#0d0d0d",
   },
-}
+};
 
 module.exports = {
-  content: ['./src/**/*.{js,jsx,ts,tsx}'],
+  content: ["./src/**/*.{js,jsx,ts,tsx}"],
   theme: {
     screens: {
-      sm: '640px',
-      md: '768px',
-      lg: '1024px',
-      xl: '1440px',
+      sm: "640px",
+      md: "768px",
+      lg: "1024px",
+      xl: "1440px",
     },
-    backgroundColor: (theme) => ({ ...theme('colors'), ...colors }),
-    borderColor: (theme) => ({ ...theme('colors'), ...colors }),
-    textColor: (theme) => ({ ...theme('colors'), ...colors }),
-    placeholderColor: (theme) => ({ ...theme('colors'), ...colors }),
+    backgroundColor: (theme) => ({ ...theme("colors"), ...colors }),
+    borderColor: (theme) => ({ ...theme("colors"), ...colors }),
+    textColor: (theme) => ({ ...theme("colors"), ...colors }),
+    placeholderColor: (theme) => ({ ...theme("colors"), ...colors }),
     extend: {
       fontFamily: {
-        sans: ['Sora', ...defaultTheme.fontFamily.sans],
-        content: ['Source\\ Sans\\ Pro', ...defaultTheme.fontFamily.sans],
+        sans: ["Sora", ...defaultTheme.fontFamily.sans],
+        content: ["Source\\ Sans\\ Pro", ...defaultTheme.fontFamily.sans],
       },
       fontSize: {
-        tab: ['18px', '28px'],
+        tab: ["18px", "28px"],
       },
-      backgroundColor: ['disabled'],
-      textColor: ['disabled'],
+      backgroundColor: ["disabled"],
+      textColor: ["disabled"],
       keyframes: {
         wiggle: {
-          '0%, 100%': { transform: 'rotate(-3deg)' },
-          '50%': { transform: 'rotate(3deg)' },
+          "0%, 100%": { transform: "rotate(-3deg)" },
+          "50%": { transform: "rotate(3deg)" },
         },
       },
       animation: {
-        wiggle: 'wiggle 3s ease-in-out infinite',
+        wiggle: "wiggle 3s ease-in-out infinite",
       },
       width: {
-        page: '100%',
-        'page-md': '640px',
-        'page-lg': '896px',
-        'page-xl': '1312px',
+        page: "100%",
+        "page-md": "640px",
+        "page-lg": "896px",
+        "page-xl": "1312px",
       },
     },
   },
@@ -59,9 +59,9 @@ module.exports = {
     plugin(function ({ addBase, theme }) {
       addBase({
         body: {
-          color: theme('textColor.palette.600'),
+          color: theme("textColor.palette.600"),
         },
-      })
+      });
     }),
   ],
-}
+};