diff --git a/src/components/Nvim/NvimEditor.tsx b/src/components/Nvim/NvimEditor.tsx
index 28513e8..21a0ecc 100644
--- a/src/components/Nvim/NvimEditor.tsx
+++ b/src/components/Nvim/NvimEditor.tsx
@@ -1 +1,3 @@
-export const NvimEditor = () =>
editor
;
+export const NvimEditor = (props: { data: string }) => (
+ {props.data}
+);
diff --git a/src/components/Nvim/NvimTree.tsx b/src/components/Nvim/NvimTree.tsx
index ec25961..20eca84 100644
--- a/src/components/Nvim/NvimTree.tsx
+++ b/src/components/Nvim/NvimTree.tsx
@@ -3,6 +3,7 @@ import { CHAR_HEIGHT, CHAR_WIDTH } from "../Kitty";
import { type ReactNode, useEffect, useState } from "react";
import { type InnerKittyProps } from "~/utils/types";
import { type Nvim } from ".";
+import { useNavigate } from "react-router-dom";
type FileIcon = {
char: string;
@@ -12,7 +13,7 @@ type FileIcon = {
type File = {
name: string;
} & (
- | { type: "file" }
+ | { type: "file"; directory?: File & { type: "directory" } }
| { type: "directory"; files: Array; folded: boolean }
);
@@ -41,19 +42,20 @@ const sortFiles = (files: Array) =>
export const NvimTree = (props: InnerKittyProps) => {
const { rootManifest, activeKitty } = useApp();
+ const navigate = useNavigate();
- const [selected, setSelected] = useState(0);
const [files, setFiles] = useState>(
sortFiles([
{
type: "directory",
name: "projects",
files: rootManifest.projects,
- folded: false,
+ folded: true,
},
...rootManifest.files.map((name) => ({ type: "file" as const, name })),
]),
);
+ const [selected, setSelected] = useState(files.length - 1);
const tree: Array = [];
let y = 0;
@@ -87,7 +89,11 @@ export const NvimTree = (props: InnerKittyProps) => {
for (let i = 0; i < fileOrDir.files.length; i++) {
y++;
if (y === selected)
- selectedFile = { type: "file", name: fileOrDir.files[i] };
+ selectedFile = {
+ type: "file",
+ name: fileOrDir.files[i],
+ directory: fileOrDir,
+ };
const icon = FILE_ICONS.UNKNOWN;
const fy = y;
@@ -150,7 +156,12 @@ export const NvimTree = (props: InnerKittyProps) => {
if (selectedFile.type === "directory") {
selectedFile.folded = !selectedFile.folded;
} else {
- console.log(`navigate to ${selectedFile.name}`);
+ let filePath = "";
+ if (selectedFile.directory) {
+ filePath += `${selectedFile.directory.name}/`;
+ }
+
+ navigate(`?view=${filePath}${selectedFile.name}`);
}
setFiles([...files]);
diff --git a/src/components/Nvim/index.tsx b/src/components/Nvim/index.tsx
index 5952687..369c7e0 100644
--- a/src/components/Nvim/index.tsx
+++ b/src/components/Nvim/index.tsx
@@ -4,9 +4,59 @@ import { NvimEditor } from "./NvimEditor";
import { NvimInput } from "./NvimInput";
import { NvimStatusBar } from "./NvimStatusBar";
import { NvimTree } from "./NvimTree";
+import { useLocation, useNavigate } from "react-router-dom";
+import { useEffect, useState } from "react";
+import axios from "axios";
+
+const fetchData = async (
+ branch: string,
+ repo: string,
+ file: string,
+): Promise => {
+ try {
+ const response = await axios.get(
+ `https://raw.githubusercontent.com/pihkaal/${repo}/${branch}/${file}`,
+ );
+ return response.data;
+ } catch {
+ return null;
+ }
+};
export const Nvim = (_props: {}) => {
const kitty = useKitty();
+ const location = useLocation();
+ const navigate = useNavigate();
+
+ const [data, setData] = useState();
+
+ useEffect(() => {
+ const params = new URLSearchParams(location.search);
+ const view = params.get("view");
+ if (!view) {
+ navigate("?view=README.md");
+ return;
+ }
+
+ const path = view.split("/");
+ if (path.length === 1) {
+ path.splice(0, 0, "pihkaal");
+ }
+ const repo = path[0]!;
+ const file = path[1]!;
+
+ void (async () => {
+ const data =
+ (await fetchData("main", repo, file)) ??
+ (await fetchData("dev", repo, file));
+ if (!data) {
+ navigate("?view=README.md");
+ return;
+ }
+
+ setData(data);
+ })();
+ }, [location, navigate]);
return (