🚧 Start working on RepositoryViewer

nest_frontend/components/providers/RepositoryViewer.js

@@ -0,0 +1,22 @@
+import React  from "react"
+import Style from "./RepositoryViewer.module.css"
+import classNames from "classnames"
+import ContextRepositoryViewer from "../../contexts/ContextRepositoryViewer"
+
+
+export default function RepositoryViewer({
+                                             id,
+                                         }) {
+    return (
+        <ContextRepositoryViewer.Provider
+            value={{
+                id,
+
+            }}
+        >
+            <div className={classNames(Style.RepositoryViewer, className)}>
+
+            </div>
+        </ContextRepositoryViewer.Provider>
+    )
+}

nest_frontend/components/providers/RepositoryViewer.module.css

@@ -0,0 +1,16 @@
+.RepositoryViewer {
+    display: grid;
+
+    grid-template-areas:
+        "b c d"
+        "b e e"
+        "b f f"
+        "b g g";
+    grid-template-columns: 400px 1fr 1fr;
+    grid-template-rows: auto auto 1fr auto;
+
+    grid-gap: 10px;
+
+    width: 100%;
+    height: 100%;
+}

nest_frontend/contexts/ContextRepositoryViewer.js

@@ -0,0 +1,7 @@
+import { createContext } from "react"
+
+
+/**
+ * @todo Document this.
+ */
+export default createContext(null)

nest_frontend/hooks/useRepositoryViewer.js

@@ -0,0 +1,14 @@
+import { useContext } from "react"
+import ContextRepositoryViewer from "../contexts/ContextRepositoryViewer"
+
+
+/**
+ * @todo Document this.
+ */
+export default function useRepositoryViewer() {
+    const context = useContext(ContextRepositoryViewer)
+    if(!context) {
+        throw new Error("This component must be placed inside a RepositoryViewer.")
+    }
+    return context
+}