Updated mode select

docs/widgets/services/linkwarden.md

@@ -14,17 +14,14 @@ widget:
   key: myApiKeyHere # On your Linkwarden install, go to Settings > Access Tokens. Generate a token.
 ```
 
-Use `mode` to show the stats found in the fields and/or the recent bookmarks.
-
-Examples:
-`mode: ["stats", "recent"]` or `mode: ["stats"]` or `mode: ["recent"]`
+Use `mode` to show a list of recent bookmarks.
 
 ```yaml
 widget:
   type: linkwarden
   url: http://linkwarden.host.or.ip
   key: myApiKeyHere
-  mode: ["stats", "recent"]
+  mode: ["recent"]
 ```
 
 Use `params` to set which collections and/or tags to display links from.

src/widgets/linkwarden/component.jsx

@@ -10,7 +10,7 @@ export default function Component({ service }) {
   // Assign icons. Assign recent/collections/tags to query by id(s)
   const bookmarkTypes = useMemo(
     () => ({
-      recent: { ids: widget.mode.includes("recent") ? ["0"] : [] }, // "0" Is a made-up number used to allow looping in processBookmarks()
+      recent: { ids: widget.mode?.includes("recent") ? ["0"] : [] }, // "0" Is a made-up number used to allow looping in processBookmarks()
       collection: {
         ids: widget.params?.collectionIds ? widget.params.collectionIds : [],
       },
@@ -195,15 +195,16 @@ export default function Component({ service }) {
   // Render when data is available
   return (
     <>
-      {widget.mode.includes("stats") && (
       <Container service={service}>
         <Block label="linkwarden.links" value={stats.totalLinks} />
         <Block label="linkwarden.collections" value={stats.collections.total} />
         <Block label="linkwarden.tags" value={stats.tags.total} />
       </Container>
-      )}
 
-      {Object.keys(bookmarks).map((type) => (
+      {Object.keys(bookmarks).map((type) => {
+        const dataAvailable = Object.keys(bookmarks[type].data).length > 0;
+
+        return dataAvailable ? (
           <div
             key={type}
             className="service-container grid gap-2 p-1"
@@ -252,7 +253,8 @@ export default function Component({ service }) {
               </div>
             ))}
           </div>
-      ))}
+        ) : null; // Render nothing if there's no data
+      })}
     </>
   );
 }