Update avatar styling and enhance workflow

Removed 'mr-2' from avatar styling in 'account-selector.tsx' and enhanced alignment within the group. Several environment variables were added in the GitHub workflow, improving the security and consistency of the test job. The names for 'typescript' and 'test' jobs are also standardized for better readability.

.github/workflows/workflow.yml

@@ -6,6 +6,7 @@ on:
     branches: [ main ]
 jobs:
   typescript:
+    name: ʦ TypeScript
     timeout-minutes: 8
     runs-on: ubuntu-latest
     steps:
@@ -37,8 +38,15 @@ jobs:
         run: pnpm run lint
 
   test:
+    name: ⚫️ Test
     timeout-minutes: 8
     runs-on: ubuntu-latest
+    env:
+      SUPABASE_SERVICE_ROLE_KEY: ${{ secrets.SUPABASE_SERVICE_ROLE_KEY }}
+      SUPABASE_DB_WEBHOOK_SECRET: ${{ secrets.SUPABASE_DB_WEBHOOK_SECRET }}
+      STRIPE_SECRET_KEY: ${{ secrets.STRIPE_SECRET_KEY }}
+      STRIPE_WEBHOOK_SECRET: ${{ secrets.STRIPE_WEBHOOK_SECRET }}
+
     steps:
       - uses: actions/checkout@v4
         with:

packages/features/accounts/src/components/account-selector.tsx

@@ -129,7 +129,7 @@ export function AccountSelector({
                 <span className={'flex items-center space-x-2'}>
                   <Avatar
                     className={
-                      'group-hover:border-border mr-2 h-6 w-6 border border-transparent'
+                      'group-hover:border-border h-6 w-6 border border-transparent'
                     }
                   >
                     <AvatarImage src={account.image ?? undefined} />
@@ -191,7 +191,7 @@ export function AccountSelector({
                         data-test={'account-selector-team'}
                         data-name={account.label}
                         data-slug={account.value}
-                        className={'group'}
+                        className={'group flex space-x-2'}
                         key={account.value}
                         value={account.value ?? ''}
                         onSelect={(currentValue) => {
@@ -204,14 +204,11 @@ export function AccountSelector({
                         }}
                       >
                         <Avatar
-                          className={cn(
+                          className={cn('h-6 w-6 border border-transparent', {
-                            'mr-2 h-6 w-6 border border-transparent',
+                            ['border-border']: value === account.value,
-                            {
+                            ['group-hover:border-border ']:
-                              ['border-border']: value === account.value,
+                              value !== account.value,
-                              ['group-hover:border-border ']:
+                          })}
-                                value !== account.value,
-                            },
-                          )}
                         >
                           <AvatarImage src={account.image ?? undefined} />