cd needs work

src/components/button.astro

@@ -16,6 +16,10 @@ const {href, display, color = "transparent"} = Astro.props
 		height: 100%;
 		padding: 0 20px 0 20px;
 
-		&:hover { background-color: var(--hf-button-hover-color) !important }
+		&:hover {
+			background-color: var(--hf-button-hover-color) !important;
+
+			& > a { color: black }
+		}
 	}
 </style>

src/components/react/shell/command/list.tsx

@@ -1,10 +1,9 @@
 import type { JSX } from "react"
-import { Entry } from "../fs/fs"
-import { blue } from "../color"
-import { set_working_dir } from "../fs/fn"
+import { bold } from "../color"
+import { get_working_dir_name_full, set_working_dir, SetDirStatus } from "../fs/fn"
 
 type args = string[]
-type command = JSX.Element | undefined
+type command = JSX.Element | boolean
 
 function parse_ls(entries: JSX.Element[]) {
 	return <div className="horizontal-display">
@@ -13,7 +12,14 @@ function parse_ls(entries: JSX.Element[]) {
 }
 
 function cd(args: args): command {
-	set_working_dir(args[1])
+	const new_dir_status = set_working_dir(args[1])
+
+	if (new_dir_status === SetDirStatus.NotADirectory) {
+		return <p>{"cd: \""}{bold(args[1])}{"\" is not a directory"}</p>
+	} else if (new_dir_status === SetDirStatus.NotFound) {
+		return <p>{"cd: The directory \""}{bold(args[1])}{"\" does not exist"}</p>
+	}
+	return true
 }
 
 function ls(args: args): command {
@@ -23,16 +29,15 @@ function ls(args: args): command {
 	// 	}
 	// 	return <p>{`${working_dir}`}</p>
 	// }
+	return true
 }
 
 function pwd(args: args): command {
-	const tree: string[] = []
-
-	return <p>{`${tree.join("/")}`}</p>
+	return <p>{`${get_working_dir_name_full()}`}</p>
 }
 
 function cat(args: args): command {
-	return
+	return true
 }
 
 interface commands_list {

src/components/react/shell/fs/fn.ts

@@ -1,7 +1,11 @@
-import { fs } from "./fs"
+import { Entry, EntryType, fs, type FsEntrySignature } from "./fs"
 
 let working_dir = ["/", "home", "user"]
 
+function get_working_dir_name(): string {
+	return working_dir[working_dir.length-1]
+}
+
 function get_working_dir_name_full(): string {
 	const w_dir_clone = [...working_dir]
 	const root = w_dir_clone.shift()
@@ -11,25 +15,61 @@ function get_working_dir_name_full(): string {
 	return "shift-error"
 }
 
-function get_working_dir_name(): string {
-	return working_dir[working_dir.length-1]
+const enum SetDirStatus {
+	Valid,
+	NotFound,
+	NotADirectory
 }
+interface FsIterEntry {
+	readonly entry: FsEntrySignature | null,
+	readonly status: SetDirStatus
+}
+function iter_fs_to_goal(w_dir_clone: string[]): FsIterEntry {
+	let next_iter = fs[0]
 
-function set_working_dir(name: string) {
-	let new_dir;
-	const w_dir_clone = [...working_dir]
-	w_dir_clone.push(name)
-	w_dir_clone.map(p => p !== "/" ? p+"/" : p).forEach(f => {
-		for (let i = 0; i<fs.length; i++) {
-			if (fs[i].name === f) {
+	for (const w_dir of w_dir_clone) {
+		if (w_dir === "/") { continue }
+		if (next_iter.inner) {
+			const found = next_iter.inner.find(entry => entry.name === w_dir)
 
+			if (!found) {
+				return { entry: null, status: SetDirStatus.NotFound }
+			}
+			if (found.type !== EntryType.Directory) {
+				return { entry: null, status: SetDirStatus.NotADirectory }
+			}
+			if (found.name === w_dir_clone[w_dir_clone.length-1]) {
+				return { entry: next_iter, status: SetDirStatus.Valid }
+			} else {
+				next_iter = found.inner as FsEntrySignature
 			}
 		}
-	})
+	}
+	return { entry: null, status: SetDirStatus.NotFound }
+}
+
+function set_working_dir(name: string): SetDirStatus {
+	if (name === ".") { return SetDirStatus.Valid }
+
+	const w_dir_clone = [...working_dir]
+	if (name === "..") { w_dir_clone.pop() } else { w_dir_clone.push(name) }
+
+	const iter_status = iter_fs_to_goal(w_dir_clone)
+	if (iter_status.status === SetDirStatus.Valid) {
+		working_dir = w_dir_clone
+	}
+	return iter_status.status
+}
+
+function working_dir_entries() {
+	const w_dir_clone = [...working_dir]
+	const iter_status = iter_fs_to_goal(w_dir_clone)
+
 }
 
 export {
-	get_working_dir_name_full,
 	get_working_dir_name,
-	set_working_dir
+	get_working_dir_name_full,
+	set_working_dir,
+	SetDirStatus
 }

src/components/react/shell/fs/fs.ts

@@ -8,9 +8,12 @@ const enum Permissions {
 	rw
 }
 
+type FsEntrySignature = Entry<Entry<{}>[]> //I did this!
+
 const user = [
 	Entry("about_me.txt", "about me inside", Permissions.rw),
 	Entry("services.txt", "services inside", Permissions.rw),
+	Entry("hi", [], Permissions.rw)
 ]
 const home = [
 	Entry("user", user, Permissions.rw)
@@ -25,7 +28,7 @@ const fs = [
 
 type File = string
 interface Entry<T = File> {
-	readonly inner: T,
+	readonly inner?: T,
 	readonly name: string,
 	readonly type: EntryType,
 	readonly permissions: Permissions
@@ -41,6 +44,7 @@ function Entry<T = File>(name: string, inner: T, permissions: Permissions): Entr
 
 export {
 	fs,
+	type FsEntrySignature,
 	EntryType,
 	Permissions,
 	Entry

src/components/react/shell/prompt.tsx

@@ -1,4 +1,4 @@
-import { get_working_dir_name_full } from "./fs/fn"
+import { get_working_dir_name } from "./fs/fn"
 import { cyan, green } from "./color"
 
 const userAgent = navigator.userAgent
@@ -10,7 +10,7 @@ if (browser_name_fallible) {
 }
 
 function working_dir() {
-	const name = get_working_dir_name_full()
+	const name = get_working_dir_name()
 	return name === "user" ? "~" : name
 }
 

src/layouts/Webpage.astro

@@ -25,7 +25,7 @@ import Footer from "../components/footer.astro"
 		color-scheme: dark;
 
 		--body-background-color: rgb(0,0,0);
-		--hf-button-hover-color: rgb(50,50,50);
+		--hf-button-hover-color: rgb(255,255,255);
 	}
 	::selection {
 		background-color: rgb(255,255,255);