move url parameters context into other hooks

Rather than have components use the URL parameters context directly, and
pass the page URL and parameters to hooks, we instead have the hooks
access the TimesSquareUrlParametersContext to get the necessary context
for getting the page URL, etc.

apps/squareone/src/components/TimesSquareGitHubPagePanel/TimesSquareGitHubPagePanel.js

@@ -11,38 +11,14 @@ import styled from 'styled-components';
 import getConfig from 'next/config';
 import Head from 'next/head';
 import Error from 'next/error';
-import { useRouter } from 'next/router';
 
 import useTimesSquarePage from '../../hooks/useTimesSquarePage';
 import TimesSquareParameters from '../TimesSquareParameters';
-import TimesSquareUrlParametersContext from '../TimesSquareUrlParametersProvider';
 
 export default function TimesSquareGitHubPagePanel({}) {
   const { publicRuntimeConfig } = getConfig();
-  const router = useRouter();
-  // const { tsPageUrl } = React.useContext(TimesSquareUrlParametersContext);
-  const { timesSquareUrl } = publicRuntimeConfig;
 
-  // Get components out of the URL path. Only /github-pr/ pages have owner,
-  // repo, and commit components in the path. In /github/ pages the owner
-  // and repo are part of tsSlug.
-  const { tsSlug, owner = null, repo = null, commit = null } = router.query;
-  console.log('tsSlug: ', tsSlug);
-
-  // Since the page's path is a [...tsSlug], we need to join the parts of the
-  // path to get the full slug. This combines the owner, repo, directory, and
-  // notebook name for regular /github/ pages, or just the directory and
-  // notebook name for /github-pr/ pages.
-  const githubSlug = tsSlug ? tsSlug.join('/') : null;
-
-  // Construct the URL for the Times Square API endpoint that gives information
-  // about the page. GitHub PR pages (github-pr) have different API URLs than
-  // regular GitHub pages.
-  const tsPageUrl = router.pathname.startsWith('/times-square/github-pr')
-    ? `${timesSquareUrl}/v1/github-pr/${owner}/${repo}/${commit}/${githubSlug}`
-    : `${timesSquareUrl}/v1/github/${githubSlug}`;
-
-  const pageData = useTimesSquarePage(tsPageUrl);
+  const pageData = useTimesSquarePage();
 
   if (pageData.loading) {
     return <p>Loading...</p>;

apps/squareone/src/components/TimesSquareMainGitHubNav/TimesSquareMainGitHubNav.js

@@ -8,6 +8,7 @@ import useGitHubContentsListing from './useGitHubContentsListing';
 function TimesSquareMainGitHubNav({ pagePath }) {
   const { publicRuntimeConfig } = getConfig();
   const { timesSquareUrl } = publicRuntimeConfig;
+  console.log(timesSquareUrl);
   const githubContents = useGitHubContentsListing(timesSquareUrl);
 
   if (githubContents) {

apps/squareone/src/components/TimesSquareNotebookViewer/TimesSquareNotebookViewer.js

@@ -22,14 +22,8 @@ const StyledIframe = styled.iframe`
 `;
 
 export default function TimesSquareNotebookViewer({}) {
-  const { tsPageUrl, notebookParameters, displaySettings } = React.useContext(
-    TimesSquareUrlParametersContext
-  );
-  const htmlStatus = useHtmlStatus(
-    tsPageUrl,
-    notebookParameters,
-    displaySettings
-  );
+  const { tsPageUrl } = React.useContext(TimesSquareUrlParametersContext);
+  const htmlStatus = useHtmlStatus();
 
   if (htmlStatus.error) {
     return (

apps/squareone/src/components/TimesSquareNotebookViewer/useHtmlStatus.js

@@ -4,8 +4,10 @@
  * dynamic refreshing of data about a page's HTML rendering.
  */
 
+import React from 'react';
 import useSWR from 'swr';
 import useTimesSquarePage from '../../hooks/useTimesSquarePage';
+import { TimesSquareUrlParametersContext } from '../TimesSquareUrlParametersProvider';
 
 const fetcher = (...args) => fetch(...args).then((res) => res.json());
 
@@ -20,8 +22,11 @@ export function parameterizeUrl(baseUrl, parameters, displaySettings) {
   return url.toString();
 }
 
-function useHtmlStatus(pageUrl, parameters, displaySettings) {
-  const pageData = useTimesSquarePage(pageUrl);
+function useHtmlStatus() {
+  const { notebookParameters: parameters, displaySettings } = React.useContext(
+    TimesSquareUrlParametersContext
+  );
+  const pageData = useTimesSquarePage();
 
   const { data, error } = useSWR(
     () => parameterizeUrl(pageData.htmlStatusUrl, parameters, displaySettings),

apps/squareone/src/components/TimesSquareParameters/TimesSquareParameters.js

@@ -35,12 +35,9 @@ function inputFactory(props) {
 export default function TimesSquareParameters({}) {
   const router = useRouter();
 
-  const {
-    tsPageUrl,
-    displaySettings,
-    notebookParameters: userParameters,
-  } = React.useContext(TimesSquareUrlParametersContext);
-  const { parameters } = useTimesSquarePage(tsPageUrl);
+  const { displaySettings, notebookParameters: userParameters } =
+    React.useContext(TimesSquareUrlParametersContext);
+  const { parameters } = useTimesSquarePage();
 
   const ajv = new Ajv({ coerceTypes: true });
 

apps/squareone/src/hooks/useTimesSquarePage.js

@@ -1,9 +1,13 @@
+import React from 'react';
 import useSWR from 'swr';
 
+import { TimesSquareUrlParametersContext } from '../components/TimesSquareUrlParametersProvider';
+
 const fetcher = (...args) => fetch(...args).then((res) => res.json());
 
-function useTimesSquarePage(pageUrl) {
-  const { data, error } = useSWR(pageUrl, fetcher);
+function useTimesSquarePage() {
+  const { tsPageUrl } = React.useContext(TimesSquareUrlParametersContext);
+  const { data, error } = useSWR(tsPageUrl, fetcher);
 
   return {
     error: error,