Added optional title for tool workflow (#4256)

- Added optional title for tool workflow - Not added to any tool. Just
there for when we need it
- Added add files button to files step
- renamed Local files button in filemanager to Upload Files
-

---------

Co-authored-by: Connor Yoh <[email protected]>
Co-authored-by: James Brunton <[email protected]>

frontend/src/components/tools/shared/FileStatusIndicator.tsx

@@ -1,6 +1,9 @@
 import React from "react";
-import { Text } from "@mantine/core";
+import { Text, Anchor } from "@mantine/core";
 import { useTranslation } from "react-i18next";
+import FolderIcon from '@mui/icons-material/Folder';
+import { useFilesModalContext } from "../../../contexts/FilesModalContext";
+import { useAllFiles } from "../../../contexts/FileContext";
 
 export interface FileStatusIndicatorProps {
   selectedFiles?: File[];
@@ -12,13 +15,39 @@ const FileStatusIndicator = ({
   placeholder,
 }: FileStatusIndicatorProps) => {
   const { t } = useTranslation();
-  const defaultPlaceholder = placeholder || t("files.placeholder", "Select a PDF file in the main view to get started");
-  
-  // Only show content when no files are selected
+  const { openFilesModal } = useFilesModalContext();
+  const { files: workbenchFiles } = useAllFiles();
+
+  // Check if there are no files in the workbench
+  if (workbenchFiles.length === 0) {
+    return (
+      <Text size="sm" c="dimmed">
+        {t("files.noFiles", "No files uploaded. ")}{" "}
+        <Anchor
+          size="sm"
+          onClick={openFilesModal}
+          style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '4px' }}
+        >
+          <FolderIcon style={{ fontSize: '14px' }} />
+          {t("files.addFiles", "Add files")}
+        </Anchor>
+      </Text>
+    );
+  }
+
+  // Show selection status when there are files in workbench
   if (selectedFiles.length === 0) {
     return (
       <Text size="sm" c="dimmed">
-        {defaultPlaceholder}
+        {t("files.selectFromWorkbench", "Select files from the workbench or ") + " "}
+        <Anchor
+          size="sm"
+          onClick={openFilesModal}
+          style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '4px' }}
+        >
+          <FolderIcon style={{ fontSize: '14px' }} />
+          {t("files.addFiles", "Add files")}
+        </Anchor>
       </Text>
     );
   }