fix: Now when a repository dont have an sbom is shown correctly

Author: GermanMT

app/[locale]/docs/page.tsx

@@ -9,7 +9,12 @@ import {
 import { FileText } from 'lucide-react'
 import Image from 'next/image'
 import { getDictionary, type Locale } from '@/lib/i18n'
-import { Navigation, HeroSection, OverviewSection, DocsTabs } from '@/components/feature/docs/shared'
+import {
+  Navigation,
+  HeroSection,
+  OverviewSection,
+  DocsTabs,
+} from '@/components/feature/docs/shared'
 import {
   AuthTab,
   GraphTab,
@@ -47,7 +52,7 @@ export default async function DocsPage({ params }: PageProps) {
       <Navigation t={t} locale={locale} />
 
       {/* Hero Section */}
-      <HeroSection t={t} locale={locale} />
+      <HeroSection t={t} />
 
       {/* Main Content */}
       <section className="py-8 sm:py-12 lg:py-16 px-4">
@@ -65,22 +70,13 @@ export default async function DocsPage({ params }: PageProps) {
             <VexgenTab vexgenEndpoints={vexgenEndpoints} t={t} />
 
             {/* Graph Tab */}
-            <GraphTab
-              depexRepositoryEndpoints={depexGraphEndpoints}
-              t={t}
-            />
+            <GraphTab depexRepositoryEndpoints={depexGraphEndpoints} t={t} />
 
             {/* File Operations Tab */}
-            <FileOpsTab
-              depexFileOperationEndpoints={depexFileOperationEndpoints}
-              t={t}
-            />
+            <FileOpsTab depexFileOperationEndpoints={depexFileOperationEndpoints} t={t} />
 
             {/* Config Operations Tab */}
-            <ConfigOpsTab
-              depexConfigOperationEndpoints={depexConfigOperationEndpoints}
-              t={t}
-            />
+            <ConfigOpsTab depexConfigOperationEndpoints={depexConfigOperationEndpoints} t={t} />
 
             {/* Schemas Tab */}
             <TabsContent value="schemas" className="mt-4 sm:mt-6">

components/feature/docs/index.ts

@@ -8,4 +8,3 @@ export { ConfigOpsTab } from './tabs/ConfigOpsTab'
 // Shared components
 export { EndpointCard } from './shared/EndpointCard'
 export { OverviewSection } from './shared/OverviewSection'
-export { EcosystemsSection } from './shared/EcosystemsSection'

components/feature/docs/shared/DocsTabs.tsx

@@ -1,8 +1,7 @@
 'use client'
 
 import { useEffect, useState } from 'react'
-import { useRouter } from 'next/navigation'
-import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui'
+import { Tabs, TabsList, TabsTrigger } from '@/components/ui'
 
 interface DocsTabsProps {
   children: React.ReactNode
@@ -11,12 +10,14 @@ interface DocsTabsProps {
 
 export function DocsTabs({ children, t }: DocsTabsProps) {
   const [activeTab, setActiveTab] = useState('overview')
-  const router = useRouter()
 
   // Read the hash from URL on mount
   useEffect(() => {
     const hash = window.location.hash.replace('#', '')
-    if (hash && ['overview', 'auth', 'vexgen', 'graph', 'file-ops', 'config-ops', 'schemas'].includes(hash)) {
+    if (
+      hash &&
+      ['overview', 'auth', 'vexgen', 'graph', 'file-ops', 'config-ops', 'schemas'].includes(hash)
+    ) {
       setActiveTab(hash)
     }
   }, [])
@@ -42,9 +43,7 @@ export function DocsTabs({ children, t }: DocsTabsProps) {
         </TabsTrigger>
         <TabsTrigger value="vexgen" className="text-xs sm:text-sm py-2 px-1 sm:px-3">
           <span className="lg:hidden">VEX/TIX</span>
-          <span className="hidden lg:inline">
-            {(t as any).vexgen?.tabTitle || 'VEX & TIX'}
-          </span>
+          <span className="hidden lg:inline">{(t as any).vexgen?.tabTitle || 'VEX & TIX'}</span>
         </TabsTrigger>
         <TabsTrigger value="graph" className="text-xs sm:text-sm py-2 px-1 sm:px-3">
           <span className="lg:hidden">{t.docs.graph}</span>

components/feature/docs/shared/EndpointCard.tsx

@@ -30,14 +30,16 @@ export const EndpointCard: React.FC<EndpointCardProps> = ({ endpoint, index, t }
         return 'bg-gray-100 text-gray-800 border-gray-200 dark:bg-gray-900 dark:text-gray-300 dark:border-gray-700'
     }
   }
-  
+
   const methodColorClasses = getMethodColorClasses(endpoint.method)
-  
+
   return (
     <div key={index} className="border rounded-lg p-3 sm:p-4">
       <div className="flex flex-col sm:flex-row sm:items-center justify-between gap-2 mb-2">
         <div className="flex items-center gap-2 sm:gap-3 min-w-0">
-          <span className={`inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold border ${methodColorClasses}`}>
+          <span
+            className={`inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-semibold border ${methodColorClasses}`}
+          >
             {endpoint.method}
           </span>
           <code className="text-xs sm:text-sm font-mono break-all">{endpoint.path}</code>

components/feature/docs/shared/HeroSection.tsx

@@ -3,10 +3,9 @@ import { BookOpen, ExternalLink } from 'lucide-react'
 
 interface HeroSectionProps {
   t: any
-  locale: string
 }
 
-export const HeroSection: React.FC<HeroSectionProps> = ({ t, locale }) => {
+export const HeroSection: React.FC<HeroSectionProps> = ({ t }) => {
   return (
     <section className="py-8 sm:py-12 lg:py-16 px-4 bg-gradient-to-br from-primary/10 via-background to-secondary/10">
       <div className="container mx-auto text-center">

components/feature/docs/tabs/AuthTab.tsx

@@ -30,12 +30,7 @@ export const AuthTab: React.FC<AuthTabProps> = ({ authEndpoints, t }) => {
           <CardContent>
             <div className="space-y-3 sm:space-y-4">
               {authEndpoints.map((endpoint, index) => (
-                <EndpointCard
-                  key={index}
-                  endpoint={endpoint}
-                  index={index}
-                  t={t}
-                />
+                <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
               ))}
             </div>
           </CardContent>

components/feature/docs/tabs/ConfigOpsTab.tsx

@@ -15,10 +15,7 @@ interface ConfigOpsTabProps {
   t: any
 }
 
-export const ConfigOpsTab: React.FC<ConfigOpsTabProps> = ({
-  depexConfigOperationEndpoints,
-  t,
-}) => {
+export const ConfigOpsTab: React.FC<ConfigOpsTabProps> = ({ depexConfigOperationEndpoints, t }) => {
   return (
     <TabsContent value="config-ops" className="mt-4 sm:mt-6">
       <div className="space-y-4 sm:space-y-6">
@@ -35,12 +32,7 @@ export const ConfigOpsTab: React.FC<ConfigOpsTabProps> = ({
           <CardContent>
             <div className="space-y-3 sm:space-y-4">
               {depexConfigOperationEndpoints.map((endpoint, index) => (
-                <EndpointCard
-                  key={index}
-                  endpoint={endpoint}
-                  index={index}
-                  t={t}
-                />
+                <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
               ))}
             </div>
           </CardContent>

components/feature/docs/tabs/FileOpsTab.tsx

@@ -15,10 +15,7 @@ interface FileOpsTabProps {
   t: any
 }
 
-export const FileOpsTab: React.FC<FileOpsTabProps> = ({
-  depexFileOperationEndpoints,
-  t,
-}) => {
+export const FileOpsTab: React.FC<FileOpsTabProps> = ({ depexFileOperationEndpoints, t }) => {
   return (
     <TabsContent value="file-ops" className="mt-4 sm:mt-6">
       <div className="space-y-4 sm:space-y-6">
@@ -35,12 +32,7 @@ export const FileOpsTab: React.FC<FileOpsTabProps> = ({
           <CardContent>
             <div className="space-y-3 sm:space-y-4">
               {depexFileOperationEndpoints.map((endpoint, index) => (
-                <EndpointCard
-                  key={index}
-                  endpoint={endpoint}
-                  index={index}
-                  t={t}
-                />
+                <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
               ))}
             </div>
           </CardContent>

components/feature/docs/tabs/GraphTab.tsx

@@ -15,10 +15,7 @@ interface GraphTabProps {
   t: any
 }
 
-export const GraphTab: React.FC<GraphTabProps> = ({
-  depexRepositoryEndpoints,
-  t,
-}) => {
+export const GraphTab: React.FC<GraphTabProps> = ({ depexRepositoryEndpoints, t }) => {
   return (
     <TabsContent value="graph" className="mt-4 sm:mt-6">
       <div className="space-y-4 sm:space-y-6">
@@ -35,12 +32,7 @@ export const GraphTab: React.FC<GraphTabProps> = ({
           <CardContent>
             <div className="space-y-3 sm:space-y-4">
               {depexRepositoryEndpoints.map((endpoint, index) => (
-                <EndpointCard
-                  key={index}
-                  endpoint={endpoint}
-                  index={index}
-                  t={t}
-                />
+                <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
               ))}
             </div>
           </CardContent>

components/feature/docs/tabs/VexgenTab.tsx

@@ -25,9 +25,7 @@ export const VexgenTab: React.FC<VexgenTabProps> = ({ vexgenEndpoints, t }) => {
               <FileText className="h-4 w-4 sm:h-5 sm:w-5" />
               {t.docs.vexgen.title}
             </CardTitle>
-            <CardDescription className="text-sm">
-              {t.docs.vexgen.description}
-            </CardDescription>
+            <CardDescription className="text-sm">{t.docs.vexgen.description}</CardDescription>
           </CardHeader>
           <CardContent>
             <div className="space-y-6">
@@ -41,12 +39,7 @@ export const VexgenTab: React.FC<VexgenTabProps> = ({ vexgenEndpoints, t }) => {
                   {vexgenEndpoints
                     .filter(endpoint => endpoint.tag === 'VEX')
                     .map((endpoint, index) => (
-                      <EndpointCard
-                        key={index}
-                        endpoint={endpoint}
-                        index={index}
-                        t={t}
-                      />
+                      <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
                     ))}
                 </div>
               </div>
@@ -61,12 +54,7 @@ export const VexgenTab: React.FC<VexgenTabProps> = ({ vexgenEndpoints, t }) => {
                   {vexgenEndpoints
                     .filter(endpoint => endpoint.tag === 'TIX')
                     .map((endpoint, index) => (
-                      <EndpointCard
-                        key={index}
-                        endpoint={endpoint}
-                        index={index}
-                        t={t}
-                      />
+                      <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
                     ))}
                 </div>
               </div>
@@ -81,12 +69,7 @@ export const VexgenTab: React.FC<VexgenTabProps> = ({ vexgenEndpoints, t }) => {
                   {vexgenEndpoints
                     .filter(endpoint => endpoint.tag === 'Generation')
                     .map((endpoint, index) => (
-                      <EndpointCard
-                        key={index}
-                        endpoint={endpoint}
-                        index={index}
-                        t={t}
-                      />
+                      <EndpointCard key={index} endpoint={endpoint} index={index} t={t} />
                     ))}
                 </div>
               </div>