Add media and AI plugins, refresh editor configs

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

src/App.tsx

@@ -5,11 +5,18 @@ import {
   outlinePlugin,
 } from "@reacteditor/core";
 import createTailwindCdnPlugin from "@reacteditor/plugin-tailwind-cdn";
+import { mediaPlugin } from "@reacteditor/plugin-media";
+import "@reacteditor/plugin-media/styles.css";
+import { aiPlugin } from "@reacteditor/plugin-ai";
+import "@reacteditor/plugin-ai/styles.css";
 import { createConfig } from "@/editor/config";
 import { ShopifyProvider } from "@/editor/contexts/shopify-context";
+import { frontendAiMediaAdapter } from "@/editor/services/media-adapter";
 import { Loader } from "@/components/ui/loader";
 import schemaJson from "../app.schema.json";
 
+const AI_API_KEY = (import.meta.env.VITE_API_KEY as string | undefined) ?? "";
+
 type Pages = Record<string, { root: any; content: any[] }>;
 
 const SHOPIFY_DOMAIN =
@@ -46,7 +53,20 @@ export default function App() {
   );
 
   const plugins = useMemo(
-    () => [createTailwindCdnPlugin(), blocksPlugin(), outlinePlugin()],
+    () => [
+      aiPlugin({
+        api: "https://www.frontend-ai.com/cloud/api/chat",
+        headers: { "X-Api-Key": AI_API_KEY },
+        getCurrentRoute: () => ({ path: window.location.pathname }),
+      }),
+      createTailwindCdnPlugin(),
+      blocksPlugin(),
+      outlinePlugin(),
+      mediaPlugin({
+        adapter: frontendAiMediaAdapter,
+        showSearch: true,
+      }),
+    ],
     [],
   );
 

src/globals.css

@@ -1,6 +1,5 @@
 @import "tailwindcss";
 @import "tw-animate-css";
-@import "shadcn/tailwind.css";
 @import "@fontsource-variable/geist";
 
 @custom-variant dark (&:is(.dark *));