diff --git a/vweb/src/forge_simulator.jsx b/vweb/src/forge_simulator.jsx index 3afb986..0e840b8 100644 --- a/vweb/src/forge_simulator.jsx +++ b/vweb/src/forge_simulator.jsx @@ -14,7 +14,7 @@ export default function({ src: defaultSrc }) { // Whether the emulator should be running. Has to be a ref because the CPU setTimeout loop won't ever see changes in it otherwise const running = useRef(false) - const [currentFile, setCurrentFile] = useState(() => (Object.keys(window.localStorage)[0] || 'example')) + const [currentFile, setCurrentFile] = useState(() => (Object.keys(window.localStorage).sort()[0] || 'example')) useEffect(() => { if (!currentFile) { setCurrentFile('example') @@ -37,7 +37,15 @@ export default function({ src: defaultSrc }) { selectFile(name) }, []) - const removeFile = useCallback((name) => {}, []) + const removeFile = useCallback(() => { + const files = Object.keys(window.localStorage).sort() + if (files.length < 2) { return } // Can't delete the last file + if (!confirm(`Are you sure you want to delete "${currentFile}"?`)) { return } + const idx = files.indexOf(currentFile) + window.localStorage.removeItem(currentFile) + files.splice(idx, 1) + selectFile(files[Math.min(files.length - 1, idx)]) + }, [currentFile, selectFile]) // The current Forge source. Our initial state tries to look something up from localStorage, // then if that fails uses the prop. @@ -109,7 +117,7 @@ export default function({ src: defaultSrc }) { <> - +
{content}
@@ -118,13 +126,13 @@ export default function({ src: defaultSrc }) { } // A list of "files" stored in localStorage, that we can display / build / compile -function FileList({ fileList, selectFile }) { +function FileList({ fileList, selectFile, currentFile }) { const clickFile = useCallback((event) => { const name = event.target.getAttribute('data-name') selectFile(name) event.preventDefault() }, [selectFile]) - const fileRows = fileList.map(file =>
{file}
) + const fileRows = fileList.map(file =>
{file}
) return (
{fileRows} diff --git a/vweb/src/simulator.css b/vweb/src/simulator.css index b8f5b34..6e3b96f 100644 --- a/vweb/src/simulator.css +++ b/vweb/src/simulator.css @@ -70,3 +70,5 @@ a { color: #cccccc; } .buttons .run, .file-buttons .new { color: #66bb66 } .buttons .stop, .file-buttons .del { color: #bb6666 } .buttons .build { color: #aaaaff; } +.files .file.selected-file { background-color: #686868 !important; } +.files .file:hover { background-color: #505050; } \ No newline at end of file