Add quick info badges on AppList : pending notifications, available upgrades, flagged as deprecated on the catalog, or not in the catalog(anymoar)

Author: alexAubin

app/src/views/app/AppList.vue

@@ -7,11 +7,29 @@ const apps = await api
   .get<AppList>({ uri: 'apps?full', initial: true })
   .then(({ apps }) => {
     return apps
-      .map(({ id, name, description, manifest, logo }) => {
+      .map(({ id, name, description, manifest, logo, upgrade, from_catalog}) => {
         const logoUrl = logo
           ? `./applogos/${logo}.png`
           : 'data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs='
-        return { id, name: manifest.name, label: name, description, logoUrl }
+        let badges: BadgesInfos = Array();
+        let notifications_count = Object.keys(manifest.notifications.POST_INSTALL || {}).length + Object.keys(manifest.notifications.POST_UPGRADE || {}).length
+        if (notifications_count > 0)
+        {
+           badges.push({text: notifications_count + ' notifications', variant: "info", icon: 'info-circle'})
+        }
+        if (upgrade.status == "upgradable")
+        {
+           badges.push({text: 'Upgrade available', variant: "info", icon: 'arrow-up'})
+        }
+        else if (upgrade.status == "url_required")
+        {
+           badges.push({text: 'Not in catalog', variant: "danger", icon: 'chain-broken'})
+        }
+        if ((id == 'helloworld__2') || (from_catalog && from_catalog.antifeatures && Array(from_catalog.antifeatures).includes("deprecated-software")))
+        {
+           badges.push({text: 'Deprecated', variant: "warning", icon: 'exclamation-triangle'})
+        }
+        return { id, label: name, description, logoUrl, badges }
       })
       .sort((prev, app) => {
         return prev.label > app.label ? 1 : -1
@@ -38,13 +56,14 @@ const [search, filteredApps] = useSearch(apps, (s, app) =>
 
     <BListGroup>
       <YListItem
-        v-for="{ id, description, label, logoUrl } in filteredApps"
+        v-for="{ id, description, label, logoUrl, badges } in filteredApps"
         :key="id"
         :to="{ name: 'app-info', params: { id } }"
         :label="label"
         :sublabel="id"
         :description="description"
         :image-src="logoUrl"
+        :badges="badges"
       />
     </BListGroup>
   </ViewSearch>