diff --git a/package-lock.json b/package-lock.json
index 731c799..9dd19b7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,6 @@
         "@lit/react": "^1.0.2",
         "@material/web": "^1.0.1",
         "firebase": "^10.7.1",
-        "nanoid": "^5.0.4",
         "overlayscrollbars": "^2.4.5",
         "overlayscrollbars-react": "^0.5.3",
         "react": "^18.2.0",
@@ -6403,23 +6402,6 @@
         "thenify-all": "^1.0.0"
       }
     },
-    "node_modules/nanoid": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.0.4.tgz",
-      "integrity": "sha512-vAjmBf13gsmhXSgBrtIclinISzFFy22WwCYoyilZlsrRXNIHSwgFQ1bEdjRwMT3aoadeIF6HMuDRlOxzfXV8ig==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "bin": {
-        "nanoid": "bin/nanoid.js"
-      },
-      "engines": {
-        "node": "^18 || >=20"
-      }
-    },
     "node_modules/natural-compare": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
diff --git a/package.json b/package.json
index 305aed0..283e539 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,6 @@
     "@lit/react": "^1.0.2",
     "@material/web": "^1.0.1",
     "firebase": "^10.7.1",
-    "nanoid": "^5.0.4",
     "overlayscrollbars": "^2.4.5",
     "overlayscrollbars-react": "^0.5.3",
     "react": "^18.2.0",
diff --git a/src/components/DocsComp/ui/DocsTypeComp.tsx b/src/components/DocsComp/ui/DocsTypeComp.tsx
index a00b155..3da0cbf 100644
--- a/src/components/DocsComp/ui/DocsTypeComp.tsx
+++ b/src/components/DocsComp/ui/DocsTypeComp.tsx
@@ -1,5 +1,3 @@
-import { nanoid } from 'nanoid';
-
 import useScrollbar from '@/shared/lib/hooks/useScrollbar';
 import { DocsExplorerType, SchemaTypeObj } from '@/shared/types';
 
@@ -21,9 +19,9 @@ const DocsTypeComp = ({ explorer, currType }: { explorer: DocsExplorerType; curr
       const beforeSeparator = <br />;
       const afterSeparator = i >= field.args.length - 1 ? <br /> : null;
       return (
-        <p key={nanoid()} className="inline">
+        <p key={argTypeName.concat(i.toString())} className="inline">
           {separation && beforeSeparator}
-          <span className={separation ? 'pl-3' : ''} key={nanoid()}>
+          <span className={separation ? 'pl-3' : ''}>
             <span className="text-tertiary">{arg.name}</span>:&nbsp;
             {before}
             <a className="text-docs-link-text-color hover:underline" href={link} onClick={(e) => clinkHandler(e, link)}>
@@ -38,7 +36,7 @@ const DocsTypeComp = ({ explorer, currType }: { explorer: DocsExplorerType; curr
     const returnType = getTypeName(field.type);
     const [prevType, typeLink, afterType] = separateString(returnType);
     return (
-      <li key={nanoid()}>
+      <li key={field.name}>
         <span className="text-docs-field-text-color">{field.name}</span>
         {args.length > 0 && '('}
         {args}
@@ -58,7 +56,7 @@ const DocsTypeComp = ({ explorer, currType }: { explorer: DocsExplorerType; curr
   });
   const inputFields = currType?.inputFields?.map((field) => {
     return (
-      <li key={nanoid()}>
+      <li key={field?.type?.name}>
         {field.name}:&nbsp;
         <a
           className="text-docs-link-text-color hover:underline"
@@ -72,11 +70,11 @@ const DocsTypeComp = ({ explorer, currType }: { explorer: DocsExplorerType; curr
   });
   const isFields = fields || inputFields;
   const enumValues = currType?.enumValues?.map((value) => {
-    return <li key={nanoid()}>{value.name}</li>;
+    return <li key={value.name}>{value.name}</li>;
   });
   const possibleTypes = currType?.possibleTypes?.map((type) => {
     return (
-      <li key={nanoid()}>
+      <li key={type.name}>
         <a
           className="text-docs-link-text-color hover:underline"
           href={type.name}
@@ -89,7 +87,7 @@ const DocsTypeComp = ({ explorer, currType }: { explorer: DocsExplorerType; curr
   });
   const interfaces = currType?.interfaces?.map((inter) => {
     return (
-      <li key={nanoid()}>
+      <li key={inter.name}>
         <a
           className="text-docs-link-text-color hover:underline"
           href={inter.name}