ignore: hide provider connect button until providers loaded

packages/app/src/pages/layout.tsx

@@ -916,7 +916,7 @@ export default function Layout(props: ParentProps) {
         </div>
         <div class="flex flex-col gap-1.5 self-stretch items-start shrink-0 px-2 py-3">
           <Switch>
-            <Match when={!providers.paid().length && expanded()}>
+            <Match when={providers.all().length > 0 && !providers.paid().length && expanded()}>
               <div class="rounded-md bg-background-stronger shadow-xs-border-base">
                 <div class="p-3 flex flex-col gap-2">
                   <div class="text-12-medium text-text-strong">Getting started</div>
@@ -935,7 +935,7 @@ export default function Layout(props: ParentProps) {
                 </Tooltip>
               </div>
             </Match>
-            <Match when={true}>
+            <Match when={providers.all().length > 0}>
               <Tooltip placement="right" value="Connect provider" inactive={expanded()}>
                 <Button
                   class="flex w-full text-left justify-start text-text-base stroke-[1.5px] rounded-lg px-2"