From bb1840798d85444b05f4a08b9f5502920b439a8b Mon Sep 17 00:00:00 2001
From: Mish Ushakov <10400064+mishushakov@users.noreply.github.com>
Date: Mon, 13 Jan 2025 19:30:41 +0100
Subject: [PATCH] Added workers-edge-runtime troubleshooting guide (#536)

Adds a troubleshooting guide for issues regarding the JS SDK on Vercel
Edge Runtime, Cloudflare Workers

---------

Co-authored-by: Mish Ushakov <mishushakov@users.noreply.github.com>
---
 .../sdks/workers-edge-runtime/page.mdx             |  3 +++
 .../src/components/Navigation/NavigationLink.tsx   | 14 ++++++--------
 apps/web/src/components/Navigation/routes.tsx      | 11 ++++++++++-
 3 files changed, 19 insertions(+), 9 deletions(-)
 create mode 100644 apps/web/src/app/(docs)/docs/troubleshooting/sdks/workers-edge-runtime/page.mdx

diff --git a/apps/web/src/app/(docs)/docs/troubleshooting/sdks/workers-edge-runtime/page.mdx b/apps/web/src/app/(docs)/docs/troubleshooting/sdks/workers-edge-runtime/page.mdx
new file mode 100644
index 000000000..69a1897d8
--- /dev/null
+++ b/apps/web/src/app/(docs)/docs/troubleshooting/sdks/workers-edge-runtime/page.mdx
@@ -0,0 +1,3 @@
+# Vercel Edge Runtime and Cloudflare Workers
+
+The E2B JavaScript SDK currently lacks support for Vercel Edge Runtime and Cloudflare Workers due to transport layer package incompatibility used for Sandbox communication. We recommend using supported runtimes like Node, Bun, or Deno instead.
diff --git a/apps/web/src/components/Navigation/NavigationLink.tsx b/apps/web/src/components/Navigation/NavigationLink.tsx
index db85b6c6e..7fd528ba8 100644
--- a/apps/web/src/components/Navigation/NavigationLink.tsx
+++ b/apps/web/src/components/Navigation/NavigationLink.tsx
@@ -9,7 +9,6 @@ export function NavigationLink({
   className,
   link,
 }: {
-
   className?: string
   link: NavLink
 }) {
@@ -18,7 +17,8 @@ export function NavigationLink({
   const hash = typeof window !== 'undefined' ? window.location.hash : ''
 
   // Modify the isActive check to include hash comparison if needed
-  const isActive = pathname === link.href ||
+  const isActive =
+    pathname === link.href ||
     (link.href.includes('#') && pathname + hash === link.href)
   // const pathname = usePathname()
   // console.log(link)
@@ -34,19 +34,17 @@ export function NavigationLink({
         isActive
           ? 'text-white bg-zinc-800'
           : 'hover:text-white text-zinc-400 bg-transparent',
-        className,
+        className
       )}
     >
-      <div className="flex items-center justify-start gap-1">
+      <div className="flex items-center justify-start gap-1 overflow-hidden">
         {link.icon}
         {link.tag ? (
           <div className="flex items-center gap-2">
             <span className={clsx('truncate', isActive ? 'text-white' : '')}>
               {link.title}
             </span>
-            <Tag>
-              {link.tag}
-            </Tag>
+            <Tag>{link.tag}</Tag>
           </div>
         ) : (
           <span className={clsx('truncate', isActive ? 'text-white' : '')}>
@@ -56,4 +54,4 @@ export function NavigationLink({
       </div>
     </Link>
   )
-}
\ No newline at end of file
+}
diff --git a/apps/web/src/components/Navigation/routes.tsx b/apps/web/src/components/Navigation/routes.tsx
index d1bf3ea30..e5ce63c71 100644
--- a/apps/web/src/components/Navigation/routes.tsx
+++ b/apps/web/src/components/Navigation/routes.tsx
@@ -425,6 +425,15 @@ export const docRoutes: NavGroup[] = [
   {
     title: 'Troubleshooting',
     items: [
+      {
+        title: 'SDKs',
+        links: [
+          {
+            title: 'Vercel Edge Runtime and Cloudflare Workers',
+            href: '/docs/troubleshooting/sdks/workers-edge-runtime',
+          },
+        ],
+      },
       {
         title: 'Templates',
         links: [
@@ -486,4 +495,4 @@ export const sdkRefRoutes: VersionedNavGroup[] = (
       group?.title && sdkRefNameMap[group.title]
         ? sdkRefNameMap[group.title]
         : group.title,
-  }))
\ No newline at end of file
+  }))