diff --git a/src/backend/base/langflow/components/models/AnthropicModel.py b/src/backend/base/langflow/components/models/AnthropicModel.py
index 1c0fb6338..154bf970a 100644
--- a/src/backend/base/langflow/components/models/AnthropicModel.py
+++ b/src/backend/base/langflow/components/models/AnthropicModel.py
@@ -1,4 +1,3 @@
-from typing import Optional
 
 from langchain_anthropic.chat_models import ChatAnthropic
 from pydantic.v1 import SecretStr
diff --git a/src/backend/base/langflow/components/models/ChatLiteLLMModel.py b/src/backend/base/langflow/components/models/ChatLiteLLMModel.py
index 2d0d1c7a0..99eda2afd 100644
--- a/src/backend/base/langflow/components/models/ChatLiteLLMModel.py
+++ b/src/backend/base/langflow/components/models/ChatLiteLLMModel.py
@@ -1,4 +1,4 @@
-from typing import Any, Dict, Optional
+from typing import Optional
 
 from langchain_community.chat_models.litellm import ChatLiteLLM, ChatLiteLLMException
 from langflow.base.constants import STREAM_INFO_TEXT
@@ -177,4 +177,4 @@ class ChatLiteLLMModelComponent(LCModelComponent):
         )
 
         return output
-    
\ No newline at end of file
+    
diff --git a/src/backend/base/langflow/components/models/GroqModel.py b/src/backend/base/langflow/components/models/GroqModel.py
index edff619b7..b114abe2a 100644
--- a/src/backend/base/langflow/components/models/GroqModel.py
+++ b/src/backend/base/langflow/components/models/GroqModel.py
@@ -1,4 +1,3 @@
-from typing import Optional
 
 from langchain_groq import ChatGroq
 from langflow.base.models.groq_constants import MODEL_NAMES
@@ -103,4 +102,4 @@ class GroqModel(LCModelComponent):
             streaming=stream,
         )
 
-        return output
\ No newline at end of file
+        return output
diff --git a/src/backend/base/langflow/components/models/HuggingFaceModel.py b/src/backend/base/langflow/components/models/HuggingFaceModel.py
index 98cd8950e..f15caa786 100644
--- a/src/backend/base/langflow/components/models/HuggingFaceModel.py
+++ b/src/backend/base/langflow/components/models/HuggingFaceModel.py
@@ -1,4 +1,3 @@
-from typing import Optional
 
 from langchain_community.chat_models.huggingface import ChatHuggingFace
 from langchain_community.llms.huggingface_endpoint import HuggingFaceEndpoint
@@ -65,4 +64,4 @@ class HuggingFaceEndpointsComponent(LCModelComponent):
             raise ValueError("Could not connect to HuggingFace Endpoints API.") from e
 
         output = ChatHuggingFace(llm=llm)
-        return output
\ No newline at end of file
+        return output
diff --git a/src/backend/base/langflow/components/models/OllamaModel.py b/src/backend/base/langflow/components/models/OllamaModel.py
index bcca0b107..095554dcb 100644
--- a/src/backend/base/langflow/components/models/OllamaModel.py
+++ b/src/backend/base/langflow/components/models/OllamaModel.py
@@ -1,4 +1,3 @@
-from typing import Any, Dict, List, Optional
 
 from langchain_community.chat_models import ChatOllama
 from langflow.base.constants import STREAM_INFO_TEXT
@@ -226,4 +225,4 @@ class ChatOllamaComponent(LCModelComponent):
         except Exception as e:
             raise ValueError("Could not initialize Ollama LLM.") from e
 
-        return output
\ No newline at end of file
+        return output
diff --git a/src/backend/base/langflow/custom/custom_component/custom_component.py b/src/backend/base/langflow/custom/custom_component/custom_component.py
index e324a442a..9eec57693 100644
--- a/src/backend/base/langflow/custom/custom_component/custom_component.py
+++ b/src/backend/base/langflow/custom/custom_component/custom_component.py
@@ -21,7 +21,6 @@ from langflow.type_extraction.type_extraction import (
     extract_union_types_from_generic_alias,
 )
 from langflow.utils import validate
-from pydantic import BaseModel
 
 if TYPE_CHECKING:
     from langflow.graph.graph.base import Graph
diff --git a/src/backend/base/langflow/graph/vertex/base.py b/src/backend/base/langflow/graph/vertex/base.py
index 3e1db9063..4c1595c20 100644
--- a/src/backend/base/langflow/graph/vertex/base.py
+++ b/src/backend/base/langflow/graph/vertex/base.py
@@ -13,7 +13,7 @@ from langflow.graph.utils import UnbuiltObject, UnbuiltResult
 from langflow.interface.initialize import loading
 from langflow.interface.listing import lazy_load_dict
 from langflow.schema.artifact import ArtifactType
-from langflow.schema.schema import INPUT_FIELD_NAME, Log, build_logs
+from langflow.schema.schema import INPUT_FIELD_NAME, Log
 from langflow.services.deps import get_storage_service
 from langflow.services.monitor.utils import log_transaction
 from langflow.utils.constants import DIRECT_TYPES
diff --git a/src/backend/base/langflow/schema/schema.py b/src/backend/base/langflow/schema/schema.py
index 65aad288d..70e412186 100644
--- a/src/backend/base/langflow/schema/schema.py
+++ b/src/backend/base/langflow/schema/schema.py
@@ -1,4 +1,4 @@
-from typing import Any, Literal
+from typing import Literal
 
 from typing_extensions import TypedDict
 
diff --git a/src/frontend/src/components/stringReaderComponent/index.tsx b/src/frontend/src/components/stringReaderComponent/index.tsx
index 8b1b0e41f..1c4b6c0a7 100644
--- a/src/frontend/src/components/stringReaderComponent/index.tsx
+++ b/src/frontend/src/components/stringReaderComponent/index.tsx
@@ -1,7 +1,14 @@
+import TextModal from "../../modals/textModal";
+
 export default function StringReader({
   string,
 }: {
   string: string;
 }): JSX.Element {
-  return <span className="truncate">{string}</span>;
+  return (
+    string.length > 10 ?
+      <TextModal value={string}>
+        <span className="truncate">{string}</span>
+      </TextModal> : <span className="truncate">{string}</span>
+  );
 }
diff --git a/src/frontend/src/constants/constants.ts b/src/frontend/src/constants/constants.ts
index 1c1ad8d82..e2c171f7a 100644
--- a/src/frontend/src/constants/constants.ts
+++ b/src/frontend/src/constants/constants.ts
@@ -141,6 +141,7 @@ export const CODE_PROMPT_DIALOG_SUBTITLE =
 
 export const CODE_DICT_DIALOG_SUBTITLE =
   "Edit your dictionary. This dialog allows you to create your own customized dictionary. You can add as many key-value pairs as you want. While in edit mode, you can enter ({}) or ([]), and this will result in adding a new object or array.";
+
 /**
  * The base text for subtitle of Prompt Dialog
  * @constant
diff --git a/src/frontend/src/modals/textModal/index.tsx b/src/frontend/src/modals/textModal/index.tsx
new file mode 100644
index 000000000..ff2ddad84
--- /dev/null
+++ b/src/frontend/src/modals/textModal/index.tsx
@@ -0,0 +1,61 @@
+import "ace-builds/src-noconflict/ace";
+import "ace-builds/src-noconflict/ext-language_tools";
+import "ace-builds/src-noconflict/mode-python";
+import "ace-builds/src-noconflict/theme-github";
+import "ace-builds/src-noconflict/theme-twilight";
+// import "ace-builds/webpack-resolver";
+import { cloneDeep } from "lodash";
+import { useEffect, useState } from "react";
+import JsonView from "react18-json-view";
+import "react18-json-view/src/dark.css";
+import "react18-json-view/src/style.css";
+import IconComponent from "../../components/genericIconComponent";
+import { CODE_DICT_DIALOG_SUBTITLE, TEXT_DIALOG_SUBTITLE } from "../../constants/constants";
+import { useDarkStore } from "../../stores/darkStore";
+import BaseModal from "../baseModal";
+import TextOutputView from "../../shared/components/textOutputView";
+import { Button } from "../../components/ui/button";
+
+export default function TextModal({
+  children,
+  value,
+}: {
+  children: JSX.Element;
+  value: Object;
+}): JSX.Element {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <BaseModal
+      size="medium-h-full"
+      open={open}
+      setOpen={setOpen}
+    >
+      <BaseModal.Trigger className="h-full">{children}</BaseModal.Trigger>
+      <BaseModal.Header
+        description={"Inspect the text below."}
+      >
+        <span className="pr-2">
+          {"View Text"}
+        </span>
+        <IconComponent
+          name="Type"
+          className="h-6 w-6 pl-1 text-primary"
+          aria-hidden="true"
+        />
+      </BaseModal.Header>
+      <BaseModal.Content>
+        <div className="flex h-full w-full flex-col transition-all">
+            <TextOutputView value={value} left={false} />
+        </div>
+      </BaseModal.Content>
+      <BaseModal.Footer>
+        <div className="flex w-full justify-end pt-2">
+          <Button className="flex gap-2 px-3" onClick={() => setOpen(false)}>
+            Close
+          </Button>
+        </div>
+      </BaseModal.Footer>
+    </BaseModal>
+  );
+}