feat: loading files from manifest
This commit is contained in:
@@ -1,9 +1,11 @@
|
||||
import { useState, useEffect } from "react";
|
||||
import { useApp } from "~/context/AppContext";
|
||||
import { useTerminal } from "~/context/TerminalContext";
|
||||
import { api } from "~/utils/api";
|
||||
import { FILE_STYLES, File } from "~/utils/filesystem";
|
||||
import { type Cell } from "~/utils/terminal/cell";
|
||||
import { TerminalRenderer } from "~/utils/terminal/renderer";
|
||||
import { theme } from "~/utils/terminal/theme";
|
||||
import { Manifest } from "~/utils/types";
|
||||
|
||||
const PATH_FOLDED: Cell = {
|
||||
char: "",
|
||||
@@ -15,36 +17,6 @@ const PATH_UNFOLDED: Cell = {
|
||||
foreground: theme.blue,
|
||||
};
|
||||
|
||||
const FILE_STYLES = {
|
||||
directory: {
|
||||
char: "\ue6ad", // \ue6ad ||| \ueaf6
|
||||
foreground: theme.blue,
|
||||
},
|
||||
md: {
|
||||
char: "\ue73e",
|
||||
foreground: theme.blue,
|
||||
},
|
||||
asc: {
|
||||
char: "\uf43d",
|
||||
foreground: theme.yellow,
|
||||
},
|
||||
} as const satisfies Record<string, Cell>;
|
||||
|
||||
type FileType = keyof typeof FILE_STYLES;
|
||||
|
||||
type File = {
|
||||
name: string;
|
||||
} & (
|
||||
| {
|
||||
type: Exclude<FileType, "directory">;
|
||||
}
|
||||
| {
|
||||
type: "directory";
|
||||
children: Array<File>;
|
||||
folded: boolean;
|
||||
}
|
||||
);
|
||||
|
||||
const FILES_SRC: Array<File> = [
|
||||
{
|
||||
name: "projects",
|
||||
@@ -59,11 +31,39 @@ const FILES_SRC: Array<File> = [
|
||||
{ name: "pubkey.asc", type: "asc" },
|
||||
];
|
||||
|
||||
const buildFileTree = (manifest: Manifest): Array<File> => {
|
||||
if (manifest === undefined) return [];
|
||||
|
||||
const files: Array<File> = [];
|
||||
manifest.projects.forEach(project => {
|
||||
if (project.name === "pihkaal") {
|
||||
project.files.forEach(file => {
|
||||
files.push({
|
||||
name: file,
|
||||
type: "md",
|
||||
});
|
||||
});
|
||||
} else {
|
||||
files.push({
|
||||
name: project.name,
|
||||
type: "directory",
|
||||
folded: true,
|
||||
children: project.files.map(file => ({
|
||||
name: file,
|
||||
type: "md",
|
||||
})),
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return files;
|
||||
};
|
||||
|
||||
export const NvimTree = () => {
|
||||
const { data: repos } = api.github.getRepos.useQuery();
|
||||
const manifest = useApp();
|
||||
|
||||
const [selected, setSelected] = useState(0);
|
||||
const [files, setFiles] = useState(FILES_SRC);
|
||||
const [files, setFiles] = useState(buildFileTree(manifest));
|
||||
|
||||
const { cols: width, rows: height } = useTerminal();
|
||||
const canvas = new TerminalRenderer(width * 0.2, height - 2, {
|
||||
|
||||
39
src/context/AppContext.tsx
Normal file
39
src/context/AppContext.tsx
Normal file
@@ -0,0 +1,39 @@
|
||||
import {
|
||||
createContext,
|
||||
useEffect,
|
||||
useContext,
|
||||
useState,
|
||||
ReactNode,
|
||||
} from "react";
|
||||
import axios from "axios";
|
||||
import { Manifest } from "~/utils/types";
|
||||
|
||||
const AppContext = createContext<Manifest | undefined>(undefined);
|
||||
|
||||
export const AppContextProvider = (props: {
|
||||
children: Array<ReactNode> | ReactNode;
|
||||
}) => {
|
||||
const [manifest, setManifest] = useState<Manifest>();
|
||||
|
||||
useEffect(() => {
|
||||
axios
|
||||
.get<Manifest>(
|
||||
"https://raw.githubusercontent.com/pihkaal/pihkaal/main/manifest.json",
|
||||
)
|
||||
.then(x => {
|
||||
setManifest(x.data);
|
||||
console.log(x.data);
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<AppContext.Provider value={manifest}>{props.children}</AppContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export const useApp = () => {
|
||||
const context = useContext(AppContext);
|
||||
if (!context) throw new Error("useApp must be used inside the app lol");
|
||||
|
||||
return context;
|
||||
};
|
||||
@@ -3,10 +3,11 @@ import { Terminal } from "~/components/Terminal";
|
||||
import { MusicVisualizer } from "~/components/MusicVisualizer";
|
||||
import { MusicPlayer } from "~/components/MusicPlayer";
|
||||
import { Nvim } from "~/components/Nvim/Nvim";
|
||||
import { AppContextProvider } from "~/context/AppContext";
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<>
|
||||
<AppContextProvider>
|
||||
<Head>
|
||||
<title>pihkaal</title>
|
||||
</Head>
|
||||
@@ -36,6 +37,6 @@ export default function Home() {
|
||||
</Terminal>
|
||||
</div>
|
||||
</main>
|
||||
</>
|
||||
</AppContextProvider>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,10 +1,18 @@
|
||||
import { Octokit } from "@octokit/rest";
|
||||
import { publicProcedure } from "../../trpc";
|
||||
import axios from "axios";
|
||||
|
||||
type Manifest = {
|
||||
projects: Array<{
|
||||
name: string;
|
||||
files: Array<string>;
|
||||
}>;
|
||||
};
|
||||
|
||||
export const getRepos = publicProcedure.query(async () => {
|
||||
const octokit = new Octokit();
|
||||
const { data: manifest } = await axios.get<Manifest>(
|
||||
"https://raw.githubusercontent.com/pihkaal/pihkaal/main/manifest.json",
|
||||
);
|
||||
|
||||
//const response = await octokit.repos.listForUser({ username: "pihkaal" });
|
||||
//const repos = response.data.filter(x => x.name !== "pihkaal");
|
||||
return [];
|
||||
return manifest;
|
||||
});
|
||||
|
||||
32
src/utils/filesystem.ts
Normal file
32
src/utils/filesystem.ts
Normal file
@@ -0,0 +1,32 @@
|
||||
import { Cell } from "./terminal/cell";
|
||||
import { theme } from "./terminal/theme";
|
||||
|
||||
export const FILE_STYLES = {
|
||||
directory: {
|
||||
char: "\ue6ad", // \ue6ad ||| \ueaf6
|
||||
foreground: theme.blue,
|
||||
},
|
||||
md: {
|
||||
char: "\ue73e",
|
||||
foreground: theme.blue,
|
||||
},
|
||||
asc: {
|
||||
char: "\uf43d",
|
||||
foreground: theme.yellow,
|
||||
},
|
||||
} as const satisfies Record<string, Cell>;
|
||||
|
||||
export type FileType = keyof typeof FILE_STYLES;
|
||||
|
||||
export type File = {
|
||||
name: string;
|
||||
} & (
|
||||
| {
|
||||
type: Exclude<FileType, "directory">;
|
||||
}
|
||||
| {
|
||||
type: "directory";
|
||||
children: Array<File>;
|
||||
folded: boolean;
|
||||
}
|
||||
);
|
||||
6
src/utils/types.ts
Normal file
6
src/utils/types.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export type Manifest = {
|
||||
projects: Array<{
|
||||
name: string;
|
||||
files: Array<string>;
|
||||
}>;
|
||||
};
|
||||
Reference in New Issue
Block a user