diff --git a/components/REPL/REPLInput.tsx b/components/REPL/REPLInput.tsx index dbdb0e9..2d42af1 100644 --- a/components/REPL/REPLInput.tsx +++ b/components/REPL/REPLInput.tsx @@ -1,7 +1,9 @@ import type { NextPage } from "next"; -import { MutableRefObject, useState, createRef } from "react"; +import useSWR from "swr"; +import { MutableRefObject, useState, createRef, useEffect } from "react"; import { CommandInterface } from "../../lib/commands"; import styles from "../../styles/REPL/REPLInput.module.css"; +import { Project } from "../../lib/projects/types"; interface REPLInputParams { historyCallback: CallableFunction; @@ -13,6 +15,11 @@ interface REPLInputParams { } } +async function fetchProjects(endpoint: string): Promise { + const res = await fetch(endpoint); + return res.json(); +} + const REPLInput: NextPage = ({historyCallback, historyClear, inputRef, modalManipulation}) => { const typed = createRef(); const completion = createRef(); @@ -20,7 +27,8 @@ const REPLInput: NextPage = ({historyCallback, historyClear, in const [justTabbed, setJustTabbed] = useState(0); const [inCmdHistory, setInCmdHistory] = useState(-1); const [cmdHistory, setCmdHistory] = useState([]); - const cmdIf = new CommandInterface(modalManipulation); + const [cmdIf, setCmdIf] = useState(new CommandInterface(modalManipulation, [])); + const { data: projects, error: projectsError } = useSWR("/api/projects", fetchProjects); const clearInput = (inputRef: HTMLInputElement) => { inputRef.value = ""; @@ -127,9 +135,13 @@ const REPLInput: NextPage = ({historyCallback, historyClear, in clearInput(input); } } - }; + useEffect(() => { + if (!projectsError && projects) setCmdIf(new CommandInterface(modalManipulation, projects)); + // In any other case we just don't create another interface. + }, [projects, projectsError, modalManipulation]); + return
diff --git a/lib/commands/definitions.ts b/lib/commands/definitions.ts index a76d6f6..f328641 100644 --- a/lib/commands/definitions.ts +++ b/lib/commands/definitions.ts @@ -1,6 +1,4 @@ import type { Command, Flag } from "./types"; -import type { Project } from "../projects/types"; -import projectList from "../projects"; function getCommandByName(name: string): Command|undefined { return commandList.find(cmd => cmd.name === name); @@ -148,7 +146,7 @@ const project: Command = { execute: (flags, args, _raw, cmdIf) => { if (project.flags && checkFlagInclude(flags, project.flags.list)) { const result = ["Found the following projects:"]; - projectList.forEach(project => result.push(`\t${project.name}\t${project.short}`)); + cmdIf.projects.forEach(project => result.push(`\t${project.name}\t${project.short}`)); return result; } @@ -156,7 +154,7 @@ const project: Command = { if (args[0] === "this") args[0] = "homepage"; - const pjt = projectList.find(p => p.name === args[0]); + const pjt = cmdIf.projects.find(p => p.name === args[0]); if (!pjt) return [ `Cannot find project ${args[0]}!`, "You can see available projects using 'project -l'." diff --git a/lib/commands/index.ts b/lib/commands/index.ts index a2cb9b0..1c6b3a2 100644 --- a/lib/commands/index.ts +++ b/lib/commands/index.ts @@ -1,3 +1,4 @@ +import { Project } from "../projects/types"; import { printSyntax, commandList } from "./definitions"; interface CommandInterfaceCallbacks { @@ -7,9 +8,11 @@ interface CommandInterfaceCallbacks { export class CommandInterface { callbacks: CommandInterfaceCallbacks; + projects: Project[]; - constructor(callbacks: CommandInterfaceCallbacks) { + constructor(callbacks: CommandInterfaceCallbacks, projects: Project[]) { this.callbacks = callbacks; + this.projects = projects; } static commandCompletion(input: string): string[] { diff --git a/package-lock.json b/package-lock.json index e1e1e02..7258d60 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,7 +10,8 @@ "next": "12.0.7", "phosphor-react": "^1.3.1", "react": "17.0.2", - "react-dom": "17.0.2" + "react-dom": "17.0.2", + "swr": "^1.1.2" }, "devDependencies": { "@types/node": "16.11.11", @@ -5388,6 +5389,14 @@ "node": ">=4" } }, + "node_modules/swr": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/swr/-/swr-1.1.2.tgz", + "integrity": "sha512-UsM0eo5T+kRPyWFZtWRx2XR5qzohs/LS4lDC0GCyLpCYFmsfTk28UCVDbOE9+KtoXY4FnwHYiF+ZYEU3hnJ1lQ==", + "peerDependencies": { + "react": "^16.11.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/table": { "version": "6.7.3", "resolved": "https://registry.npmjs.org/table/-/table-6.7.3.tgz", @@ -9828,6 +9837,12 @@ "has-flag": "^3.0.0" } }, + "swr": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/swr/-/swr-1.1.2.tgz", + "integrity": "sha512-UsM0eo5T+kRPyWFZtWRx2XR5qzohs/LS4lDC0GCyLpCYFmsfTk28UCVDbOE9+KtoXY4FnwHYiF+ZYEU3hnJ1lQ==", + "requires": {} + }, "table": { "version": "6.7.3", "resolved": "https://registry.npmjs.org/table/-/table-6.7.3.tgz", diff --git a/package.json b/package.json index bb97384..3a52e8f 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,8 @@ "next": "12.0.7", "phosphor-react": "^1.3.1", "react": "17.0.2", - "react-dom": "17.0.2" + "react-dom": "17.0.2", + "swr": "^1.1.2" }, "devDependencies": { "@types/node": "16.11.11",