Mark/esolang
1
0
Fork 0
Code Issues Packages Activity

Add side drawer to display feature guide

Browse Source
This commit is contained in:
Nilay Majorwar
2022-02-22 02:17:55 +05:30
parent 1d8413cc7d
commit 9dcfad555d
10 changed files with 274 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
pages/_app.tsx
View File

@ -1,3 +1,4 @@
import React from "react";
import "../styles/globals.css";
import "../styles/editor.css";
import "../styles/mosaic.scss";
@ -5,17 +6,24 @@ import "@blueprintjs/core/lib/css/blueprint.css";
import "@blueprintjs/icons/lib/css/blueprint-icons.css";
import "react-mosaic-component/react-mosaic-component.css";
import type { AppProps } from "next/app";
import { DarkModeProvider } from "../ui/providers/dark-mode-provider";
import { ErrorBoundaryProvider } from "../ui/providers/error-boundary-provider";
import { Providers } from "../ui/providers";
import { NextPage } from "next";
function MyApp({ Component, pageProps }: AppProps) {
return (
<ErrorBoundaryProvider>
<DarkModeProvider>
<Component {...pageProps} />
</DarkModeProvider>
</ErrorBoundaryProvider>
);
/** Type for pages that use a custom layout */
export type NextPageWithLayout = NextPage & {
getLayout?: (page: React.ReactNode) => React.ReactNode;
};
/** AppProps type but extended for custom layouts */
type AppPropsWithLayout = AppProps & {
Component: NextPageWithLayout;
};
function MyApp({ Component, pageProps }: AppPropsWithLayout) {
// Use the layout defined at the page level, if available
const getLayout =
Component.getLayout ?? ((page) => <Providers>{page}</Providers>);
return getLayout(<Component {...pageProps} />);
}
export default MyApp;

10
pages/index.tsx
View File

@ -1,5 +1,5 @@
import React from "react";
import { NextPage } from "next";
import { NextPageWithLayout } from "./_app";
import Head from "next/head";
import logoImg from "../ui/assets/logo.png";
import Image from "next/image";
@ -8,6 +8,7 @@ import Link from "next/link";
import { useDarkMode } from "../ui/providers/dark-mode-provider";
import LANGUAGES from "./languages.json";
import { GitHubIcon } from "../ui/custom-icons";
import { Providers } from "../ui/providers";
const REPO_URL = "https://github.com/nilaymaj/esolang-park";
const WIKI_URL = REPO_URL + "/wiki";
@ -50,7 +51,7 @@ const styles = {
},
};
const Index: NextPage = () => {
const Index: NextPageWithLayout = () => {
const DarkMode = useDarkMode();
const backgroundColor = DarkMode.isDark ? Colors.DARK_GRAY3 : Colors.WHITE;
@ -113,4 +114,9 @@ const Index: NextPage = () => {
);
};
// Feature guide should not be shown on the home page
Index.getLayout = function getLayout(page: React.ReactNode) {
return <Providers omitFeatureGuide={true}>{page}</Providers>;
};
export default Index;