prettier fix

dashboard/react-table.d.ts

@@ -51,21 +51,64 @@ import {
 declare module "react-table" {
   // take this file as-is, or comment out the sections that don't apply to your plugin configuration
 
-  export type TableOptions<
-    D extends object = {}
-  > = {} & UseExpandedOptions<D> & UseFiltersOptions<D> & UseGlobalFiltersOptions<D> & UseGroupByOptions<D> & UsePaginationOptions<D> & UseResizeColumnsOptions<D> & UseRowSelectOptions<D> & UseRowStateOptions<D> & UseSortByOptions<D> & Record<string, any>
+  export type TableOptions<D extends object = {}> = {} & UseExpandedOptions<D> &
+    UseFiltersOptions<D> &
+    UseGlobalFiltersOptions<D> &
+    UseGroupByOptions<D> &
+    UsePaginationOptions<D> &
+    UseResizeColumnsOptions<D> &
+    UseRowSelectOptions<D> &
+    UseRowStateOptions<D> &
+    UseSortByOptions<D> &
+    Record<string, any>;
 
-  export type Hooks<D extends object = {}> = {} & UseExpandedHooks<D> & UseGroupByHooks<D> & UseRowSelectHooks<D> & UseSortByHooks<D>
+  export type Hooks<D extends object = {}> = {} & UseExpandedHooks<D> &
+    UseGroupByHooks<D> &
+    UseRowSelectHooks<D> &
+    UseSortByHooks<D>;
 
-  export type TableInstance<D extends object = {}> = {} & UseColumnOrderInstanceProps<D> & UseExpandedInstanceProps<D> & UseFiltersInstanceProps<D> & UseGlobalFiltersInstanceProps<D> & UseGroupByInstanceProps<D> & UsePaginationInstanceProps<D> & UseRowSelectInstanceProps<D> & UseRowStateInstanceProps<D> & UseSortByInstanceProps<D>
+  export type TableInstance<D extends object = {}> =
+    {} & UseColumnOrderInstanceProps<D> &
+      UseExpandedInstanceProps<D> &
+      UseFiltersInstanceProps<D> &
+      UseGlobalFiltersInstanceProps<D> &
+      UseGroupByInstanceProps<D> &
+      UsePaginationInstanceProps<D> &
+      UseRowSelectInstanceProps<D> &
+      UseRowStateInstanceProps<D> &
+      UseSortByInstanceProps<D>;
 
-  export type TableState<D extends object = {}> = {} & UseColumnOrderState<D> & UseExpandedState<D> & UseFiltersState<D> & UseGlobalFiltersState<D> & UseGroupByState<D> & UsePaginationState<D> & UseResizeColumnsState<D> & UseRowSelectState<D> & UseRowStateState<D> & UseSortByState<D>
+  export type TableState<D extends object = {}> = {} & UseColumnOrderState<D> &
+    UseExpandedState<D> &
+    UseFiltersState<D> &
+    UseGlobalFiltersState<D> &
+    UseGroupByState<D> &
+    UsePaginationState<D> &
+    UseResizeColumnsState<D> &
+    UseRowSelectState<D> &
+    UseRowStateState<D> &
+    UseSortByState<D>;
 
-  export type ColumnInterface<D extends object = {}> = {} & UseFiltersColumnOptions<D> & UseGlobalFiltersColumnOptions<D> & UseGroupByColumnOptions<D> & UseResizeColumnsColumnOptions<D> & UseSortByColumnOptions<D>
+  export type ColumnInterface<D extends object = {}> =
+    {} & UseFiltersColumnOptions<D> &
+      UseGlobalFiltersColumnOptions<D> &
+      UseGroupByColumnOptions<D> &
+      UseResizeColumnsColumnOptions<D> &
+      UseSortByColumnOptions<D>;
 
-  export type ColumnInstance<D extends object = {}> = {} & UseFiltersColumnProps<D> & UseGroupByColumnProps<D> & UseResizeColumnsColumnProps<D> & UseSortByColumnProps<D>
+  export type ColumnInstance<D extends object = {}> =
+    {} & UseFiltersColumnProps<D> &
+      UseGroupByColumnProps<D> &
+      UseResizeColumnsColumnProps<D> &
+      UseSortByColumnProps<D>;
 
-  export type Cell<D extends object = {}, V = any> = {} & UseGroupByCellProps<D> & UseRowStateCellProps<D>
+  export type Cell<
+    D extends object = {},
+    V = any,
+  > = {} & UseGroupByCellProps<D> & UseRowStateCellProps<D>;
 
-  export type Row<D extends object = {}> = {} & UseExpandedRowProps<D> & UseGroupByRowProps<D> & UseRowSelectRowProps<D> & UseRowStateRowProps<D>
+  export type Row<D extends object = {}> = {} & UseExpandedRowProps<D> &
+    UseGroupByRowProps<D> &
+    UseRowSelectRowProps<D> &
+    UseRowStateRowProps<D>;
 }

dashboard/src/App.tsx

@@ -1,13 +1,14 @@
 import React, { Component } from "react";
-import { BrowserRouter } from "react-router-dom";
-import PorterErrorBoundary from "shared/error_handling/PorterErrorBoundary";
-import styled, { ThemeProvider, createGlobalStyle } from "styled-components";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { BrowserRouter } from "react-router-dom";
+import styled, { createGlobalStyle, ThemeProvider } from "styled-components";
 
-import MainWrapper from "./main/MainWrapper";
+import PorterErrorBoundary from "shared/error_handling/PorterErrorBoundary";
 import midnight from "shared/themes/midnight";
 import standard from "shared/themes/standard";
 
+import MainWrapper from "./main/MainWrapper";
+
 const queryClient = new QueryClient();
 
 export default class App extends Component {

dashboard/src/components/AWSCostConsent.tsx

@@ -1,17 +1,17 @@
-import React, { useState, useContext } from "react";
+import React, { useContext, useState } from "react";
 import styled from "styled-components";
 
-import { Context } from "shared/Context";
 import api from "shared/api";
+import { Context } from "shared/Context";
 
-import Modal from "./porter/Modal";
-import Text from "./porter/Text";
-import Spacer from "./porter/Spacer";
-import Fieldset from "./porter/Fieldset";
 import Button from "./porter/Button";
 import ExpandableSection from "./porter/ExpandableSection";
+import Fieldset from "./porter/Fieldset";
 import Input from "./porter/Input";
 import Link from "./porter/Link";
+import Modal from "./porter/Modal";
+import Spacer from "./porter/Spacer";
+import Text from "./porter/Text";
 
 type Props = {
   setCurrentStep: (step: string) => void;
@@ -46,7 +46,11 @@ const AWSCostConsent: React.FC<Props> = ({
           noWrapper
           expandText="[+] Show details"
           collapseText="[-] Hide details"
-          Header={<Text size={20} weight={600}>$224.58 / mo</Text>}
+          Header={
+            <Text size={20} weight={600}>
+              $224.58 / mo
+            </Text>
+          }
           ExpandedSection={
             <>
               <Spacer height="15px" />

dashboard/src/components/AzureCredentialForm.tsx

@@ -1,19 +1,18 @@
-import React, { useEffect, useState, useContext, useMemo } from "react";
+import React, { useContext, useEffect, useMemo, useState } from "react";
 import styled from "styled-components";
 import { v4 as uuidv4 } from "uuid";
 
 import api from "shared/api";
-import azure from "assets/azure.png";
-
 import { Context } from "shared/Context";
+import azure from "assets/azure.png";
 
-import Text from "./porter/Text";
-import Spacer from "./porter/Spacer";
-import Input from "./porter/Input";
 import Button from "./porter/Button";
+import Container from "./porter/Container";
 import Error from "./porter/Error";
+import Input from "./porter/Input";
 import Link from "./porter/Link";
-import Container from "./porter/Container";
+import Spacer from "./porter/Spacer";
+import Text from "./porter/Text";
 import VerticalSteps from "./porter/VerticalSteps";
 
 type Props = {
@@ -55,20 +54,18 @@ const AzureCredentialForm: React.FC<Props> = ({ goBack, proceed }) => {
           },
           {
             id: currentProject.id,
-          });
-        const azureIntegrationId = azureIntegrationResponse.data.cloud_provider_credentials_id;
+          }
+        );
+        const azureIntegrationId =
+          azureIntegrationResponse.data.cloud_provider_credentials_id;
         try {
           if (currentProject?.id != null) {
-            api.inviteAdmin(
-              "<token>",
-              {},
-              { project_id: currentProject?.id }
-            );
+            api.inviteAdmin("<token>", {}, { project_id: currentProject?.id });
           }
         } catch (err) {
           console.log(err);
         }
-        proceed(azureIntegrationId)
+        proceed(azureIntegrationId);
       } catch (err) {
         if (err.response?.data?.error) {
           setErrorMessage(err.response?.data?.error.replace("unknown: ", ""));
@@ -85,9 +82,7 @@ const AzureCredentialForm: React.FC<Props> = ({ goBack, proceed }) => {
     if (isLoading) {
       return "loading";
     } else if (errorMessage !== "") {
-      return <Error
-        message={errorMessage}
-      />;
+      return <Error message={errorMessage} />;
     } else {
       return null;
     }
@@ -96,83 +91,97 @@ const AzureCredentialForm: React.FC<Props> = ({ goBack, proceed }) => {
   const renderContent = () => {
     return (
       <VerticalSteps
-          onlyShowCurrentStep={true}
-          currentStep={currentStep}
-          steps={[
-            <>
-              <Text size={16}>Set up your Azure subscription</Text>
-              <Spacer y={.5} />
-              <Text color="helper">
-                Follow our <Link to="https://docs.porter.run/provision/provisioning-on-azure" target="_blank">documentation</Link> to create your service principal and prepare your subscription for use with Porter.
-              </Text>
-              <Spacer y={1} />
-              <Button onClick={() => { setCurrentStep(1); }}>
+        onlyShowCurrentStep={true}
+        currentStep={currentStep}
+        steps={[
+          <>
+            <Text size={16}>Set up your Azure subscription</Text>
+            <Spacer y={0.5} />
+            <Text color="helper">
+              Follow our{" "}
+              <Link
+                to="https://docs.porter.run/provision/provisioning-on-azure"
+                target="_blank"
+              >
+                documentation
+              </Link>{" "}
+              to create your service principal and prepare your subscription for
+              use with Porter.
+            </Text>
+            <Spacer y={1} />
+            <Button
+              onClick={() => {
+                setCurrentStep(1);
+              }}
+            >
+              Continue
+            </Button>
+          </>,
+          <>
+            <Text size={16}>Input Azure service principal credentials</Text>
+            <Spacer height="15px" />
+            <Text color="helper">
+              Provide the credentials for an Azure Service Principal authorized
+              on your Azure subscription.
+            </Text>
+            <Spacer y={1} />
+            <Input
+              label={<Flex>Subscription ID</Flex>}
+              value={subscriptionId}
+              setValue={(e) => {
+                setSubscriptionId(e.trim());
+              }}
+              placeholder="ex: 12345678-abcd-1234-abcd-12345678abcd"
+              width="100%"
+            />
+            <Spacer y={1} />
+            <Input
+              label={<Flex>App ID</Flex>}
+              value={clientId}
+              setValue={(e) => {
+                setClientId(e.trim());
+              }}
+              placeholder="ex: 12345678-abcd-1234-abcd-12345678abcd"
+              width="100%"
+            />
+            <Spacer y={1} />
+            <Input
+              type="password"
+              label={<Flex>Password</Flex>}
+              value={servicePrincipalKey}
+              setValue={(e) => {
+                setServicePrincipalKey(e.trim());
+              }}
+              placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
+              width="100%"
+            />
+            <Spacer y={1} />
+            <Input
+              label={<Flex>Tenant ID</Flex>}
+              value={tenantId}
+              setValue={(e) => {
+                setTenantId(e.trim());
+              }}
+              placeholder="ex: 12345678-abcd-1234-abcd-12345678abcd"
+              width="100%"
+            />
+            <Spacer y={1} />
+            <Container row>
+              <Button
+                onClick={() => {
+                  setCurrentStep(0);
+                }}
+                color="#222222"
+              >
+                Back
+              </Button>
+              <Spacer inline x={0.5} />
+              <Button onClick={saveCredentials} status={getButtonStatus()}>
                 Continue
               </Button>
-            </>,
-            <>
-                <Text size={16}>
-                  Input Azure service principal credentials
-                </Text>
-                <Spacer height="15px" />
-                <Text color="helper">
-                  Provide the credentials for an Azure Service Principal authorized on
-                  your Azure subscription.
-                </Text>
-                <Spacer y={1} />
-                <Input
-                    label={<Flex>Subscription ID</Flex>}
-                    value={subscriptionId}
-                    setValue={(e) => {
-                      setSubscriptionId(e.trim());
-                    }}
-                    placeholder="ex: 12345678-abcd-1234-abcd-12345678abcd"
-                    width="100%"
-                />
-                <Spacer y={1} />
-                <Input
-                    label={<Flex>App ID</Flex>}
-                    value={clientId}
-                    setValue={(e) => {
-                      setClientId(e.trim());
-                    }}
-                    placeholder="ex: 12345678-abcd-1234-abcd-12345678abcd"
-                    width="100%"
-                />
-                <Spacer y={1} />
-                <Input
-                    type="password"
-                    label={<Flex>Password</Flex>}
-                    value={servicePrincipalKey}
-                    setValue={(e) => {
-                      setServicePrincipalKey(e.trim());
-                    }}
-                    placeholder="○ ○ ○ ○ ○ ○ ○ ○ ○"
-                    width="100%"
-                />
-                <Spacer y={1} />
-                <Input
-                    label={<Flex>Tenant ID</Flex>}
-                    value={tenantId}
-                    setValue={(e) => {
-                      setTenantId(e.trim());
-                    }}
-                    placeholder="ex: 12345678-abcd-1234-abcd-12345678abcd"
-                    width="100%"
-                />
-              <Spacer y={1} />
-              <Container row>
-                  <Button onClick={() => { setCurrentStep(0); }} color="#222222">Back</Button>
-                  <Spacer inline x={0.5} />
-                  <Button
-                    onClick={saveCredentials}
-                    status={getButtonStatus()}
-                  >
-                  Continue
-                  </Button>
-              </Container>
-            </>,
-          ]}
+            </Container>
+          </>,
+        ]}
       />
     );
   };

dashboard/src/components/Breadcrumb.tsx

@@ -1,8 +1,8 @@
-import { Steps } from "main/home/onboarding/types";
 import React, { Fragment, useState } from "react";
-
 import styled from "styled-components";
 
+import { Steps } from "main/home/onboarding/types";
+
 type Props = {
   currentStep: string;
   steps: Array<{ value: string; label: string }>;
@@ -17,7 +17,9 @@ const Breadcrumb: React.FC<Props> = ({ currentStep, steps, onClickStep }) => {
           <Fragment key={i}>
             <Crumb
               bold={currentStep === step.value}
-              onClick={() => { onClickStep && onClickStep(step.value); }}
+              onClick={() => {
+                onClickStep && onClickStep(step.value);
+              }}
             >
               {step.label}
             </Crumb>

dashboard/src/components/Button.tsx

@@ -6,7 +6,7 @@ type Props = {
   children: React.ReactNode;
   onClick: () => void;
   className?: string;
-}
+};
 
 const Button: React.FC<Props> = ({
   children,