diff --git a/components/REPL/REPLHistory.tsx b/components/REPL/REPLHistory.tsx
index 894f1ec..fbe289e 100644
--- a/components/REPL/REPLHistory.tsx
+++ b/components/REPL/REPLHistory.tsx
@@ -1,8 +1,16 @@
import { NextPage } from "next";
+import { MutableRefObject } from "react";
import styles from "../../styles/REPL/REPLHistory.module.css";
-const REPLHistory: NextPage<{history: string[]}> = ({history}) => {
- return
+interface REPLHistoryParams {
+ history: string[];
+ inputRef: MutableRefObject
;
+}
+
+const REPLHistory: NextPage = ({history, inputRef}) => {
+ const focusInput = () => {if (inputRef.current) inputRef.current.focus();};
+
+ return
{ history.map((value, idx) =>
{value === "" ? "\u00A0" : value}
) }
;
};
diff --git a/components/REPL/REPLInput.tsx b/components/REPL/REPLInput.tsx
index b83b458..11b07c4 100644
--- a/components/REPL/REPLInput.tsx
+++ b/components/REPL/REPLInput.tsx
@@ -1,9 +1,14 @@
import type { NextPage } from "next";
-import React from "react";
+import React, { MutableRefObject } from "react";
import { commandCompletion, executeCommand } from "../../lib/commands";
import styles from "../../styles/REPL/REPLInput.module.css";
-const REPLInput: NextPage<{historyCallback: CallableFunction}> = ({historyCallback}) => {
+interface REPLInputParams {
+ historyCallback: CallableFunction;
+ inputRef: MutableRefObject;
+}
+
+const REPLInput: NextPage = ({historyCallback, inputRef}) => {
const typed = React.createRef();
const completion = React.createRef();
const [currentCmd, setCurrentCmd] = React.useState([]);
@@ -41,7 +46,7 @@ const REPLInput: NextPage<{historyCallback: CallableFunction}> = ({historyCallba
return ;
diff --git a/components/REPL/index.tsx b/components/REPL/index.tsx
index e1a5a5b..5dc955b 100644
--- a/components/REPL/index.tsx
+++ b/components/REPL/index.tsx
@@ -1,14 +1,15 @@
-import { useState } from "react";
+import { useRef, useState } from "react";
import REPLInput from "./REPLInput";
import REPLHistory from "./REPLHistory";
const REPL = () => {
const [history, manipulateHistory] = useState([]);
+ const inputRef = useRef();
const onCommandExecuted = (result: string[]) => manipulateHistory(result.reverse().concat(history).slice(0, 1000));
return (<>
-
-
+
+
>);
};