feat: update image handling and environment configuration

next.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  env: {
+    NEXT_PUBLIC_API_BASE_URL: process.env.NEXT_PUBLIC_API_BASE_URL,
+    NEXT_PUBLIC_DEFAULT_ENDPOINT: process.env.NEXT_PUBLIC_DEFAULT_ENDPOINT
+  }
+}

src/components/ui/typography/MarkdownRenderer/inlineStyles.tsx

@@ -159,16 +159,16 @@ const Img = ({ src, alt }: ImgProps) => {
         <div className="flex h-40 flex-col items-center justify-center gap-2 rounded-md bg-secondary/50 text-muted">
           <Paragraph className="text-primary">Image unavailable</Paragraph>
           <Link
-            href={src}
+            href={typeof src === 'string' ? src : '#'}
             target="_blank"
             className="max-w-md truncate underline"
           >
-            {src}
+            {typeof src === 'string' ? src : 'Invalid source'}
           </Link>
         </div>
       ) : (
         <Image
-          src={src}
+          src={typeof src === 'string' ? src : ''}
           width={96}
           height={56}
           alt={alt ?? 'Rendered image'}

src/components/ui/typography/MarkdownRenderer/styles.tsx

@@ -183,16 +183,16 @@ const Img = ({ src, alt }: ImgProps) => {
         <div className="flex h-40 flex-col items-center justify-center gap-2 rounded-md bg-secondary/50 text-muted">
           <Paragraph className="text-primary">Image unavailable</Paragraph>
           <Link
-            href={src}
+            href={typeof src === 'string' ? src : '#'}
             target="_blank"
             className="max-w-md truncate underline"
           >
-            {src}
+            {typeof src === 'string' ? src : 'Invalid source'}
           </Link>
         </div>
       ) : (
         <Image
-          src={src}
+          src={typeof src === 'string' ? src : ''}
           width={1280}
           height={720}
           alt={alt ?? 'Rendered image'}

src/store.ts

@@ -88,7 +88,8 @@ export const usePlaygroundStore = create<PlaygroundStore>()(
       hasStorage: false,
       setHasStorage: (hasStorage) => set(() => ({ hasStorage })),
       chatInputRef: { current: null },
-      selectedEndpoint: 'http://localhost:7777',
+      selectedEndpoint:
+        process.env.NEXT_PUBLIC_DEFAULT_ENDPOINT || 'http://localhost:7777',
       setSelectedEndpoint: (selectedEndpoint) =>
         set(() => ({ selectedEndpoint })),
       agents: [],