diff --git a/components/DynamicSquiggleChart.tsx b/components/DynamicSquiggleChart.tsx new file mode 100644 index 0000000..8a7a4ed --- /dev/null +++ b/components/DynamicSquiggleChart.tsx @@ -0,0 +1,26 @@ +import React from "react"; + +import dynamic from "next/dynamic"; + +const SquiggleChart = dynamic( + () => import("@quri/squiggle-components").then((mod) => mod.SquiggleChart), + { + loading: () =>

Loading...

, + ssr: false, + } +); + +export function DynamicSquiggleChart(props: any) { + if (props.squiggleString == "") { + return null; + } else { + return ( + + ); + } +} diff --git a/components/DynamicSquiggleEditorWithImportedBindings.tsx b/components/DynamicSquiggleEditorWithImportedBindings.tsx new file mode 100644 index 0000000..bc658fa --- /dev/null +++ b/components/DynamicSquiggleEditorWithImportedBindings.tsx @@ -0,0 +1,20 @@ +import React from "react"; +import dynamic from "next/dynamic"; + +const SquiggleEditorWithImportedBindings = dynamic( + () => import("@quri/squiggle-components").then((mod) => mod.SquiggleEditorWithImportedBindings), + { + loading: () =>

Loading...

, + ssr: false, + } +) + +export function DynamicSquiggleEditorWithImportedBindings( props: any ) { + return ( + + ) +}; diff --git a/components/Footer.tsx b/components/Footer.tsx new file mode 100644 index 0000000..60f7b19 --- /dev/null +++ b/components/Footer.tsx @@ -0,0 +1,19 @@ +import packageJson from "../package.json" +import styles from "../styles/Home.module.css" +import Image from 'next/image' + +export default function Footer() { + return ( + + ) +} diff --git a/components/Header.tsx b/components/Header.tsx new file mode 100644 index 0000000..bffc09a --- /dev/null +++ b/components/Header.tsx @@ -0,0 +1,51 @@ +import styles from "../styles/Header.module.css" +import Link from "next/link" + +// The approach used in this component shows how to build a sign in and sign out +// component that works on pages which support both client and server side +// rendering, and avoids any flash incorrect content on initial page load. +export default function Header() { + + return ( +
+ + + +
+ ) +} diff --git a/components/Layout.tsx b/components/Layout.tsx new file mode 100644 index 0000000..f4cbb05 --- /dev/null +++ b/components/Layout.tsx @@ -0,0 +1,21 @@ +import Header from "./Header" +import Footer from "./Footer" +import Head from "next/head" + +interface Props { + children: React.ReactNode +} + +export default function Layout({ children }: Props) { + return ( + <> + + GUCEM + + + +
+
{children}
+