Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Keyboard shortcuts can be modified through the shortcut panel and are stored in localstorage #68

Prev Previous commit
Next Next commit
resolved conflicts
  • Loading branch information
om-ray committed Jun 3, 2022
commit 16c259d52f898a0c26c6940af6b50f97773f2afa
9 changes: 4 additions & 5 deletions app/hooks/useJsonDoc.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { JSONDocument } from "~/jsonDoc.server";
type JsonDocType = {
doc: JSONDocument;
path?: string;
minimal?: boolean;
};

const JsonDocContext = createContext<JsonDocType | undefined>(undefined);
Expand All @@ -13,16 +14,14 @@ export function JsonDocProvider({
children,
doc,
path,
minimal,
}: {
children: ReactNode;
doc: JSONDocument;
path?: string;
minimal?: boolean;
}) {
return (
<JsonDocContext.Provider value={{ doc, path }}>
{children}
</JsonDocContext.Provider>
);
return <JsonDocContext.Provider value={{ doc, path, minimal }}>{children}</JsonDocContext.Provider>;
}

export function useJsonDoc(): JsonDocType {
Expand Down
30 changes: 27 additions & 3 deletions app/routes/j/$id.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ export const loader: LoaderFunction = async ({ params, request }) => {
}

const path = getPathFromRequest(request);
const minimal = getMinimalFromRequest(request);

if (doc.type == "url") {
console.log(`Fetching ${doc.url}...`);
Expand All @@ -56,12 +57,14 @@ export const loader: LoaderFunction = async ({ params, request }) => {
doc,
json,
path,
minimal,
};
} else {
return {
doc,
json: JSON.parse(doc.contents),
path,
minimal,
};
}
};
Expand All @@ -82,7 +85,24 @@ function getPathFromRequest(request: Request): string | null {
return `$.${path}`;
}

type LoaderData = { doc: JSONDocument; json: unknown; path?: string };
function getMinimalFromRequest(request: Request): boolean | undefined {
const url = new URL(request.url);

const minimal = url.searchParams.get("minimal");

if (!minimal) {
return;
}

return minimal === "true";
}

type LoaderData = {
doc: JSONDocument;
json: unknown;
path?: string;
minimal?: boolean;
};

export const meta: MetaFunction = ({ data }: { data: LoaderData | undefined }) => {
if (!data) {
Expand All @@ -108,7 +128,11 @@ export default function JsonDocumentRoute() {
}, [loaderData.path]);

return (
<JsonDocProvider doc={loaderData.doc} path={loaderData.path} key={loaderData.doc.id}>
<JsonDocProvider
doc={loaderData.doc}
path={loaderData.path}
key={loaderData.doc.id}
minimal={loaderData.minimal}>
<JsonProvider initialJson={loaderData.json}>
<JsonSchemaProvider>
<JsonColumnViewProvider>
Expand All @@ -126,7 +150,7 @@ export default function JsonDocumentRoute() {
</div>
</div>
<div className="h-screen flex flex-col sm:overflow-hidden">
<Header />
{!loaderData.minimal && <Header />}
<div className="bg-slate-50 flex-grow transition dark:bg-slate-900">
<div className="main-container flex justify-items-stretch h-full">
<SideBar />
Expand Down