(null)
+ if (!store.current) {
+ store.current = createListItemStore()
+ }
return (
-
-
- {step}
- {step !== DEFAULT_NODE.applicationSubmittedNode.key ? (
-
- ) : null}
-
-
+
+
+
+ {entry.name}
+
+ {entry.stages.map((step) => (
+
+ ))}
+
+
+
+
+
+
)
})
+const StageItem = memo(({ stage }: { stage: string }) => (
+
+
+ {stage}
+ {stage !== DEFAULT_NODE.applicationSubmittedNode.key ? (
+
+ ) : null}
+
+
+))
+
+function StageItemActions({ stage }: { stage: string }) {
+ const entry = useContext(EntryContext)
+ const deleteStageInEntry = useRootStore((state) => state.deleteStageInEntry)
+
+ return (
+
+
+
+
+ )
+}
+
function NewStageInput() {
const isAddingStage = useListItemStore((state) => state.isAddingStage)
const inputRef = useRef(null)
@@ -142,8 +176,8 @@ function ApplicationActions() {
const DefaultActions = memo(() => {
const entry = useContext(EntryContext)
const setIsAddingStage = useListItemStore((state) => state.setIsAddingStage)
- const addStageToEntry = useStore((state) => state.addStageInEntry)
- const deleteEntry = useStore((state) => state.deleteEntry)
+ const addStageToEntry = useRootStore((state) => state.addStageInEntry)
+ const deleteEntry = useRootStore((state) => state.deleteEntry)
const isApplicationFinalized =
entry.stages.at(-1) === DEFAULT_NODE.acceptedNode.key ||
diff --git a/app/home/store.ts b/app/home/store.ts
index a5e23ad..3346adf 100644
--- a/app/home/store.ts
+++ b/app/home/store.ts
@@ -2,7 +2,7 @@ import { create } from "zustand/index"
import { immer } from "zustand/middleware/immer"
import { DEFAULT_NODE, type Entry, type Node } from "~/home/graph"
-interface Store {
+interface RootStore {
nodes: Record
starts: Node["key"][]
entries: Record
@@ -10,11 +10,12 @@ interface Store {
addEntry: (name: string) => void
hasEntry: (name: string) => boolean
addStageInEntry: (stage: string, entryName: string) => void
+ editStageInEntry: (i: number, stage: string, entryName: string) => void
deleteStageInEntry: (stage: string, entryName: string) => void
deleteEntry: (entryName: string) => void
}
-const useStore = create()(
+const useRootStore = create()(
immer((set, get) => ({
isAddingEntry: false,
nodes: {
@@ -72,6 +73,17 @@ const useStore = create()(
}
}),
+ editStageInEntry: (i, stage, entryName) =>
+ set((state) => {
+ const entry = state.entries[entryName]
+ if (entry && stage) {
+ if (i >= entry.stages.length) {
+ return
+ }
+ entry.stages[i] = stage
+ }
+ }),
+
deleteStageInEntry: (stage, entryName) =>
set((state) => {
if (stage === DEFAULT_NODE.applicationSubmittedNode.key) {
@@ -119,4 +131,4 @@ const useStore = create()(
})),
)
-export { useStore }
+export { useRootStore }
diff --git a/app/routes/home.tsx b/app/routes/home.tsx
index debc662..fe31386 100644
--- a/app/routes/home.tsx
+++ b/app/routes/home.tsx
@@ -4,7 +4,7 @@ import Chart from "react-google-charts"
import { Button } from "~/components/button"
import { ApplicationList } from "~/home/application-list"
import type { Node } from "~/home/graph"
-import { useStore } from "~/home/store"
+import { useRootStore } from "~/home/store"
import { Queue } from "~/queue"
import { useUiMode } from "~/use-ui-mode"
@@ -35,8 +35,8 @@ export default function Home() {
}
function FlufferChart() {
- const nodes = useStore((state) => state.nodes)
- const starts = useStore((state) => state.starts)
+ const nodes = useRootStore((state) => state.nodes)
+ const starts = useRootStore((state) => state.starts)
const uiMode = useUiMode()
const data = useMemo(() => {
@@ -86,8 +86,8 @@ function FlufferChart() {
function AddApplicationForm() {
const [isAddingEntry, setIsAddingEntry] = useState(false)
- const addEntry = useStore((state) => state.addEntry)
- const hasEntry = useStore((state) => state.hasEntry)
+ const addEntry = useRootStore((state) => state.addEntry)
+ const hasEntry = useRootStore((state) => state.hasEntry)
const inputRef = useRef(null)
useEffect(() => {