✨feature: Add prompt import from json

src/components/SidebarAdd.astro

@@ -1,5 +1,18 @@
 ---
 // Sidebar.astro
+
+import { Code } from 'astro:components';
+
+const code = `[
+  {
+    "type": "System or Task (ONLY one)",
+    "title": "Example Prompt",
+    "description": "This is an example prompt.",
+    "tags": ["example", "test"],
+    "notes": "The prompt description."
+  }
+]
+`;
 ---
 
 <aside class="w-64 border-r h-full p-4 text-gray-100">
@@ -7,9 +20,12 @@
 
   <p class="text-sm">Use the form to add a new AI prompt to the catalog.</p>
 
-  <p class="text-sm mt-2">Make sure to include a title, type, description, and any relevant tags.</p>
+  <p class="text-sm mt-2">All fields marked with <span class="text-red-600">*</span> are required.</p>
 
-  <!-- <p class="text-sm mt-2">You can also add notes for your own reference.</p> -->
+  <h2 class="text-lg font-semibold mt-6 mb-4">Import</h2>
+  <p class="text-sm">To import prompts from a JSON file, upload a JSON file formatted as below, or download a sample <a class="underline" download href="/import-sample.json">here</a>.</p>
+
+  <Code class="bg-gray-700 rounded text-sm p-2 mt-4" code={code} lang="json" wrap />
 
   <a href="/" id="home" class="block w-fit bg-green-600 text-white px-4 py-2 mt-4 rounded hover:bg-green-700 transition-colors duration-300">
     Go Back