refactor(docs): usage dx (#4036)

nextui-org · Nov 13, 2024 · e44916c · e44916c
1 parent 9c38799
commit e44916c
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 30 deletions.
diff --git a/apps/docs/content/components/user/link-description.raw.jsx b/apps/docs/content/components/user/link-description.raw.jsx
@@ -0,0 +1,17 @@
+import {User, Link} from "@nextui-org/react";
+
+export default function App() {
+  return (
+    <User
+      avatarProps={{
+        src: "https://avatars.githubusercontent.com/u/30373425?v=4",
+      }}
+      description={
+        <Link isExternal href="https://x.com/jrgarciadev" size="sm">
+          @jrgarciadev
+        </Link>
+      }
+      name="Junior Garcia"
+    />
+  );
+}
diff --git a/apps/docs/content/components/user/link-description.ts b/apps/docs/content/components/user/link-description.ts
@@ -1,20 +1,4 @@
-const App = `import {User, Link} from "@nextui-org/react";
-
-export default function App() {
-  return (
-    <User
-      name="Junior Garcia"
-      description={(
-        <Link href="https://x.com/jrgarciadev" size="sm" isExternal>
-          @jrgarciadev
-        </Link>
-      )}
-      avatarProps={{
-        src: "https://avatars.githubusercontent.com/u/30373425?v=4"
-      }}
-    />
-  );
-}`;
+import App from "./link-description.raw.jsx?raw";
 
 const react = {
   "/App.jsx": App,

diff --git a/apps/docs/content/components/user/usage.raw.jsx b/apps/docs/content/components/user/usage.raw.jsx
@@ -0,0 +1,13 @@
+import {User} from "@nextui-org/react";
+
+export default function App() {
+  return (
+    <User
+      avatarProps={{
+        src: "https://i.pravatar.cc/150?u=a04258114e29026702d",
+      }}
+      description="Product Designer"
+      name="Jane Doe"
+    />
+  );
+}
diff --git a/apps/docs/content/components/user/usage.ts b/apps/docs/content/components/user/usage.ts
@@ -1,16 +1,4 @@
-const App = `import {User} from "@nextui-org/react";
-
-export default function App() {
-  return (
-    <User   
-      name="Jane Doe"
-      description="Product Designer"
-      avatarProps={{
-        src: "https://i.pravatar.cc/150?u=a04258114e29026702d"
-      }}
-    />
-  );
-}`;
+import App from "./usage.raw.jsx?raw";
 
 const react = {
   "/App.jsx": App,