src/ParagonPlayground/frontend/src/components/AppIcon.vue

@@ -1,13 +1,5 @@
 <script setup lang="ts">
-  type IconName =
+  type IconName = 'folder' | 'file' | 'upload' | 'download' | 'external' | 'trash' | 'x' | 'plus';
-    | 'folder'
-    | 'file'
-    | 'upload'
-    | 'download'
-    | 'external'
-    | 'trash'
-    | 'x'
-    | 'plus';
 
   const props = withDefaults(defineProps<{ name: IconName; size?: number }>(), {
     size: 16,
@@ -20,7 +12,11 @@
     file: ['M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z', 'M14 2v4a2 2 0 0 0 2 2h4'],
     upload: ['M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4', 'M17 8l-5-5-5 5', 'M12 3v12'],
     download: ['M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4', 'M7 10l5 5 5-5', 'M12 15V3'],
-    external: ['M15 3h6v6', 'M10 14 21 3', 'M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'],
+    external: [
+      'M15 3h6v6',
+      'M10 14 21 3',
+      'M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6',
+    ],
     trash: [
       'M3 6h18',
       'M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6',

src/ParagonPlayground/frontend/src/styles/main.css

@@ -11,7 +11,12 @@ body {
   margin: 0;
   background: var(--color-bg);
   color: var(--color-text);
-  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+  font-family:
+    system-ui,
+    -apple-system,
+    'Segoe UI',
+    Roboto,
+    sans-serif;
   font-size: var(--text-base);
   line-height: var(--leading-normal);
 }

src/ParagonPlayground/frontend/src/utils/utils.ts

@@ -15,4 +15,3 @@ export function formatLocaleDateWithTime(iso: string): string {
     minute: '2-digit',
   });
 }
-

src/ParagonPlayground/frontend/src/views/SettingsPage.vue

@@ -141,7 +141,6 @@ import { formatLocaleDateWithTime } from '../utils/utils';
       disconnecting.value = false;
     }
   }
-
 </script>
 
 <template>
@@ -177,7 +176,8 @@ import { formatLocaleDateWithTime } from '../utils/utils';
         <template v-if="integrationConfigured">
           <div class="integration-row">
             <div class="integration-info">
-              <span class="integration-icon"><AppIcon
+              <span class="integration-icon"
+                ><AppIcon
                   name="folder"
                   :size="20"
               /></span>
@@ -217,9 +217,7 @@ import { formatLocaleDateWithTime } from '../utils/utils';
                 class="btn btn-primary"
                 :disabled="connecting"
                 @click="
-                  connectAccount(
+                  connectAccount(connectionMode === 'byo' ? ['user-configured-oauth'] : undefined)
-                    connectionMode === 'byo' ? ['user-configured-oauth'] : undefined,
-                  )
                 "
               >
                 {{ connecting ? 'Connecting...' : 'Connect Account' }}
@@ -238,7 +236,9 @@ import { formatLocaleDateWithTime } from '../utils/utils';
               class="credential-row"
             >
               <span class="cred-type">{{ cred.integrationType }}</span>
-              <span class="cred-date">Connected {{ formatLocaleDateWithTime(cred.connectedAt) }}</span>
+              <span class="cred-date"
+                >Connected {{ formatLocaleDateWithTime(cred.connectedAt) }}</span
+              >
               <span class="cred-id">{{ cred.credentialId.slice(0, 12) }}...</span>
             </div>
           </div>