From bd5d2cd255c0f7f39514c1f38f23f00dfd0d4fb6 Mon Sep 17 00:00:00 2001
From: Ajay Singh <ajay.singh@sentry.io>
Date: Thu, 2 Oct 2025 15:52:26 -0700
Subject: [PATCH 1/2] stuff

---
 .../FileExplorerState/FileExplorerState.tsx   | 94 +++++++++++++++++++
 1 file changed, 94 insertions(+)
 create mode 100644 src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx

diff --git a/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx b/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx
new file mode 100644
index 0000000000..3a44176fa5
--- /dev/null
+++ b/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx
@@ -0,0 +1,94 @@
+import { useEffect, useState } from 'react'
+
+interface FileItem {
+  name: string
+  type: 'file' | 'dir'
+  path: string
+}
+
+interface FileExplorerStateProps {
+  initialPath?: string
+  files: FileItem[]
+  onPathChange?: (path: string) => void
+}
+
+export function FileExplorerState({
+  initialPath = '',
+  files,
+  onPathChange,
+}: FileExplorerStateProps) {
+  const [currentPath, setCurrentPath] = useState(initialPath)
+  const [expandedDirs, setExpandedDirs] = useState<string[]>([])
+
+  useEffect(() => {
+    if (initialPath) {
+      setCurrentPath(initialPath)
+    }
+  }, [initialPath, currentPath])
+
+  useEffect(() => {
+    if (currentPath && !expandedDirs.includes(currentPath)) {
+      setExpandedDirs([...expandedDirs, currentPath])
+    }
+  }, [currentPath, expandedDirs])
+
+  useEffect(() => {
+    if (onPathChange) {
+      onPathChange(currentPath)
+    }
+  }, [onPathChange, currentPath])
+
+  const handleDirectoryClick = (dirPath: string) => {
+    setCurrentPath(dirPath)
+  }
+
+  const handleBackClick = () => {
+    const parentPath = currentPath.split('/').slice(0, -1).join('/')
+    setCurrentPath(parentPath)
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center gap-2">
+        {currentPath && (
+          <button
+            onClick={handleBackClick}
+            className="rounded border border-ds-gray-tertiary px-3 py-1 text-sm hover:bg-ds-gray-primary"
+          >
+            ← Back
+          </button>
+        )}
+        <span className="font-mono text-sm text-ds-gray-senary">
+          {currentPath || '/'}
+        </span>
+      </div>
+
+      <div className="space-y-2">
+        {files
+          .filter((item) => item.path.startsWith(currentPath))
+          .map((item) => (
+            <div
+              key={item.path}
+              className="flex items-center gap-2 rounded border border-ds-gray-tertiary p-2"
+            >
+              <span className="text-sm">
+                {item.type === 'dir' ? '📁' : '📄'}
+              </span>
+              {item.type === 'dir' ? (
+                <button
+                  onClick={() => handleDirectoryClick(item.path)}
+                  className="text-sm text-ds-blue-default hover:underline"
+                >
+                  {item.name}
+                </button>
+              ) : (
+                <span className="text-sm">{item.name}</span>
+              )}
+            </div>
+          ))}
+      </div>
+    </div>
+  )
+}
+
+export default FileExplorerState

From 9d1a573c406e760fe97b23bbf12dc65551220bf0 Mon Sep 17 00:00:00 2001
From: Ajay Singh <ajay.singh@sentry.io>
Date: Mon, 6 Oct 2025 15:49:02 -0700
Subject: [PATCH 2/2] update state

---
 .../FileExplorerState/FileExplorerState.tsx       | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx b/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx
index 3a44176fa5..cec15272d3 100644
--- a/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx
+++ b/src/pages/RepoPage/shared/components/FileExplorerState/FileExplorerState.tsx
@@ -18,19 +18,16 @@ export function FileExplorerState({
   onPathChange,
 }: FileExplorerStateProps) {
   const [currentPath, setCurrentPath] = useState(initialPath)
-  const [expandedDirs, setExpandedDirs] = useState<string[]>([])
+  const [pathMetadata, setPathMetadata] = useState({
+    path: initialPath,
+    visited: false,
+  })
 
   useEffect(() => {
     if (initialPath) {
-      setCurrentPath(initialPath)
+      setPathMetadata({ path: initialPath, visited: false })
     }
-  }, [initialPath, currentPath])
-
-  useEffect(() => {
-    if (currentPath && !expandedDirs.includes(currentPath)) {
-      setExpandedDirs([...expandedDirs, currentPath])
-    }
-  }, [currentPath, expandedDirs])
+  }, [initialPath, pathMetadata])
 
   useEffect(() => {
     if (onPathChange) {