ExternalLink

apps/frontend/src/pages/catalog/[name].astro

@@ -78,23 +78,31 @@ const latestStable = stableReleases[0];
                   <dd class="text-gray-900 font-medium">{software.license}</dd>
                 </div>
               )}
-              {software.site && (
+              {software.externalLinks && software.externalLinks.map((link: any) => (
                 <div>
-                  <dt class="text-xs font-bold text-gray-400 uppercase tracking-widest mb-1">Source Code</dt>
+                  <dt class="text-xs font-bold text-gray-400 uppercase tracking-widest mb-1">{link.label}</dt>
                   <dd>
-                    <a href={software.site} target="_blank" class="text-purple-600 hover:text-purple-800 font-bold break-all">
-                      Visit Repository ↗
+                    <a href={link.url} target="_blank" class="text-purple-600 hover:text-purple-800 font-bold break-all">
+                      {link.url} ↗
                     </a>
                   </dd>
                 </div>
-              )}
+              ))}
             </dl>
           </div>
         </div>
 
         <!-- Main Content Area -->
         <div class="lg:col-span-2 space-y-8">
-          
+
+          <!-- Story -->
+          {software.story && (
+            <div class="bg-white rounded-3xl shadow-xl p-8 border border-gray-100">
+              <h2 class="text-xl font-bold text-gray-900 mb-4">About</h2>
+              <p class="text-gray-700 leading-relaxed whitespace-pre-line">{software.story}</p>
+            </div>
+          )}
+
           <!-- Latest Release (Prominent Section) -->
           {latestStable && (
             <div class="bg-gradient-to-br from-indigo-600 to-purple-700 rounded-3xl shadow-xl p-8 text-white">