Make module sync rely on local cache only

This commit makes the module sync route rely on the local cache only
without requiring queries to the module index. It also removes the
tab to install assets since dynamic installation is now in play. Since
the tab is removed and there's only one tab for most users of SI, the
tab group will be disabled and the pill counter will move to the title
of the assets panel.

Signed-off-by: Nick Gerace <[email protected]>

app/web/src/components/AssetListPanel.vue

@@ -10,6 +10,10 @@
         <template #label>
           <div class="flex flex-row gap-xs">
             <div>Assets Installed</div>
+            <PillCounter
+              v-if="!featureFlagsStore.MODULES_TAB"
+              :count="assetList.length"
+            />
           </div>
         </template>
         <div class="flex flex-row gap-xs items-center">
@@ -203,15 +207,18 @@ const categorizedAssets = computed(() =>
 
       return include;
     })
-    .reduce((categorized, asset) => {
-      let catList = categorized[asset.category];
-      if (!catList) {
-        catList = [];
-      }
-      catList.push(asset);
-      categorized[asset.category] = catList;
-      return categorized;
-    }, {} as { [key: string]: SchemaVariant[] }),
+    .reduce(
+      (categorized, asset) => {
+        let catList = categorized[asset.category];
+        if (!catList) {
+          catList = [];
+        }
+        catList.push(asset);
+        categorized[asset.category] = catList;
+        return categorized;
+      },
+      {} as { [key: string]: SchemaVariant[] },
+    ),
 );
 
 const categoryColor = (category: string) => {

app/web/src/components/CustomizeTabs.vue

@@ -1,5 +1,6 @@
 <template>
   <TabGroup
+    v-if="featureFlagsStore.MODULES_TAB"
     ref="group"
     :startSelectedTabSlug="tabContentSlug"
     marginTop="2xs"
@@ -12,21 +13,15 @@
       </template>
       <slot name="assets" />
     </TabGroupItem>
-    <TabGroupItem slug="newassets">
-      <template #label>
-        Assets Available
-        <PillCounter :count="moduleStore.installableModules.length" />
-      </template>
-      <slot name="newassets" />
-    </TabGroupItem>
-    <TabGroupItem
-      v-if="featureFlagsStore.MODULES_TAB"
-      slug="packages"
-      label="M"
-    >
+    <TabGroupItem slug="packages" label="Modules (Internal)">
       <slot name="packages" />
     </TabGroupItem>
   </TabGroup>
+
+  <!-- NOTE(nick): do not use the tab group if only one slot is used -->
+  <div v-else>
+    <slot name="assets" />
+  </div>
 </template>
 
 <script lang="ts" setup>