Add ability to see all items on a server if one is an administrator (#322)

Author: jonkeane

extensions/package-vulnerability-scanner/main.py

@@ -7,7 +7,9 @@
 client = connect.Client()
 
 @app.get("/api/content")
-async def search_content(query: str = None):
+async def search_content(show_all: bool = False):
+    if show_all:
+        return client.content.find()
     return client.me.content.find()
 
 @app.get("/api/packages/{guid}")

extensions/package-vulnerability-scanner/manifest.json

@@ -46,6 +46,6 @@
     "requiredFeatures": [
       "API Publishing"
     ],
-    "version": "2.0.2"
+    "version": "3.0.2"
   }
 }

extensions/package-vulnerability-scanner/src/components/ContentList.vue

@@ -1,9 +1,11 @@
 <script setup lang="ts">
-import { computed, ref } from "vue";
+import { computed, ref, watch } from "vue";
+import { storeToRefs } from "pinia";
 
 import { usePackagesStore } from "../stores/packages";
 import { useContentStore } from "../stores/content";
 import { useScannerStore } from "../stores/scanner";
+import { useUserStore } from "../stores/user";
 import type { User } from "../stores/user";
 import StatusMessage from "./ui/StatusMessage.vue";
 import SkeletonText from "./ui/SkeletonText.vue";
@@ -18,10 +20,22 @@ const props = defineProps<{
   user: User;
 }>();
 
+const userStore = useUserStore();
+
 const packagesStore = usePackagesStore();
 const contentStore = useContentStore();
 const scannerStore = useScannerStore();
 
+// Use store's showAllContent to persist state across remounts
+const { showAllContent } = storeToRefs(contentStore);
+
+// Watch for toggle changes and refetch content
+watch(showAllContent, async () => {
+  packagesStore.clearAllPackages();
+  await contentStore.fetchContentList(true);
+  fetchPackagesInBatches();
+});
+
 // Fetch packages in batches to avoid overwhelming the server
 async function fetchPackagesInBatches(batchSize = 3) {
   const contentToFetch = contentStore.contentList.filter(
@@ -152,6 +166,10 @@ const filteredContent = computed(() => {
 });
 
 const userHeader = computed(() => {
+  if (showAllContent.value) {
+    return "All Content on Connect";
+  }
+
   let name;
 
   if (props.user.first_name && props.user.last_name) {
@@ -166,7 +184,7 @@ const userHeader = computed(() => {
     name = props.user.username;
   }
 
-  return `${name}'s Connect Content`;
+  return `${name}'s Content on Connect`;
 });
 </script>
 
@@ -189,9 +207,25 @@ const userHeader = computed(() => {
     </div>
 
     <div v-else class="space-y-4">
-      <h2 class="text-xl font-semibold text-gray-800">
-        {{ userHeader }}
-      </h2>
+      <div class="flex items-center justify-between">
+        <h2 class="text-xl font-semibold text-gray-800">
+          {{ userHeader }}
+        </h2>
+
+        <label v-if="userStore.isAdmin" class="flex items-center gap-2 cursor-pointer">
+          <span class="text-sm text-gray-600">show:</span>
+          <span class="text-sm" :class="showAllContent ? 'text-gray-600' : 'text-gray-800 font-medium'">only mine</span>
+          <div class="relative">
+            <input
+              type="checkbox"
+              v-model="showAllContent"
+              class="sr-only peer"
+            />
+            <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-300 rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-600"></div>
+          </div>
+          <span class="text-sm" :class="showAllContent ? 'text-gray-800 font-medium' : 'text-gray-600'">all</span>
+        </label>
+      </div>
 
       <p class="text-gray-600">
         Found {{ scannerStore.content.length }} content items with

extensions/package-vulnerability-scanner/src/stores/content.ts

@@ -20,20 +20,22 @@ export const useContentStore = defineStore("content", () => {
   const contentList = ref<ContentListItem[]>([]);
   const isLoading = ref(false);
   const error = ref<Error | null>(null);
+  const showAllContent = ref(false);
 
-  // Track if content has been loaded
+  // Track if content has been loaded for the current mode
   const isContentLoaded = ref(false);
 
   // Fetch all available content items
-  async function fetchContentList() {
-    // Skip if content is already loaded
-    if (isContentLoaded.value && contentList.value.length > 0) return;
+  async function fetchContentList(forceRefresh: boolean = false) {
+    // Skip if content is already loaded for this mode (unless forcing refresh)
+    if (!forceRefresh && isContentLoaded.value && contentList.value.length > 0) return;
 
     isLoading.value = true;
     error.value = null;
 
     try {
-      const response = await fetch("api/content");
+      const url = showAllContent.value ? "api/content?show_all=true" : "api/content";
+      const response = await fetch(url);
 
       if (!response.ok) {
         throw new Error(`HTTP error! Status: ${response.status}`);
@@ -57,6 +59,7 @@ export const useContentStore = defineStore("content", () => {
     isLoading,
     error,
     isContentLoaded,
+    showAllContent,
 
     // Actions
     fetchContentList,

extensions/package-vulnerability-scanner/src/stores/packages.ts

@@ -79,6 +79,10 @@ export const usePackagesStore = defineStore("packages", () => {
     };
   }
 
+  function clearAllPackages() {
+    contentItems.value = {};
+  }
+
   return {
     // State
     contentItems,
@@ -88,5 +92,6 @@ export const usePackagesStore = defineStore("packages", () => {
     // Actions
     fetchPackagesForContent,
     setPackagesForContent,
+    clearAllPackages,
   };
 });

extensions/package-vulnerability-scanner/src/stores/user.ts

@@ -1,4 +1,4 @@
-import { ref } from "vue";
+import { ref, computed } from "vue";
 import { defineStore } from "pinia";
 
 export interface User {
@@ -18,6 +18,8 @@ export interface User {
 export const useUserStore = defineStore("user", () => {
   const user = ref<User>();
 
+  const isAdmin = computed(() => user.value?.user_role === "administrator");
+
   async function fetchCurrentUser() {
     const response = await fetch("api/user");
     const data = await response.json();
@@ -27,6 +29,7 @@ export const useUserStore = defineStore("user", () => {
 
   return {
     user,
+    isAdmin,
 
     fetchCurrentUser,
   };