WIP start implementing features with router

src/features/parent-pr-select/index.tsx

@@ -11,11 +11,7 @@ import {
 } from "../../lib/base";
 import { IStackerContext } from "../../lib/context";
 import { getBodyTextarea } from "../../lib/dom";
-import {
-  getLocation,
-  isNewPullRequestView,
-  isPullHome
-} from "../../lib/location";
+
 import { getStackerInfo, updateStackerInfo } from "../../lib/prInfo";
 import PRSelector, { ID } from "./components/PRSelector";
 
@@ -82,7 +78,11 @@ function render(
 }
 
 let sidebarObserver: MutationObserver | null;
-function attachMutationObserver(context: IStackerContext) {
+function attachMutationObserver<T>(
+  context: IStackerContext,
+  pathParams: T,
+  callback: (context: IStackerContext, pathParams: T) => void
+) {
   // Attach mutation observer
   if (sidebarObserver) {
     sidebarObserver.disconnect();
@@ -93,7 +93,7 @@ function attachMutationObserver(context: IStackerContext) {
       sidebarObserver.disconnect();
       sidebarObserver = null;
     }
-    initialize(context);
+    callback(context, pathParams);
   });
 
   const el = document.querySelector(".discussion-sidebar");
@@ -104,25 +104,23 @@ function attachMutationObserver(context: IStackerContext) {
     });
   }
 }
+interface IHomePathParams {
+  owner: string;
+  repo: string;
+  prNumber: string;
+}
 
-async function initializeHome(context: IStackerContext) {
-  if (
-    !isPullHome(context.location) &&
-    !isNewPullRequestView(context.location)
-  ) {
-    return;
-  }
-
-  const location = getLocation(document.location);
-  const pullRequests = await getPullRequests(context.accessToken)(
-    location.ownerLogin,
-    location.repoName
-  );
+export async function initializeHome(
+  context: IStackerContext,
+  pathParams: IHomePathParams
+) {
+  const { owner, repo, prNumber } = pathParams;
+  const pullRequests = await getPullRequests(context.accessToken)(owner, repo);
 
   const pullRequest = await getPullRequest(context.accessToken)(
-    location.ownerLogin,
-    location.repoName,
-    location.prNumber
+    owner,
+    repo,
+    prNumber
   );
 
   async function selectPullRequest(newParentPR: IGithubPullRequest) {
@@ -139,14 +137,21 @@ async function initializeHome(context: IStackerContext) {
   const basePR = getBasePullRequest(pullRequest, pullRequests);
 
   render(pullRequests, basePR || null, selectPullRequest);
+
+  attachMutationObserver(context, pathParams, initializeHome);
 }
 
-async function initializeNewPullRequest(context: IStackerContext) {
-  const location = getLocation(document.location);
-  const pullRequests = await getPullRequests(context.accessToken)(
-    location.ownerLogin,
-    location.repoName
-  );
+interface INewPRPathParams {
+  owner: string;
+  repo: string;
+}
+
+export async function initializeNewPullRequest(
+  context: IStackerContext,
+  pathParams: INewPRPathParams
+) {
+  const { owner, repo } = pathParams;
+  const pullRequests = await getPullRequests(context.accessToken)(owner, repo);
 
   async function selectPullRequest(newParentPR: IGithubPullRequest) {
     updateTextareaValue(newParentPR);
@@ -158,16 +163,6 @@ async function initializeNewPullRequest(context: IStackerContext) {
     ? getBasePullRequestWithStackerInfo(stackerInfo, pullRequests)
     : null;
   render(pullRequests, basePR, selectPullRequest);
-}
 
-export default async function initialize(context: IStackerContext) {
-  if (isPullHome(context.location)) {
-    await initializeHome(context);
-    attachMutationObserver(context);
-  }
-
-  if (isNewPullRequestView(context.location)) {
-    await initializeNewPullRequest(context);
-    attachMutationObserver(context);
-  }
+  attachMutationObserver(context, pathParams, initializeNewPullRequest);
 }

src/index.tsx

@@ -2,17 +2,26 @@
 // import diffSelect from "./features/diff-select";
 // import fadeOutUnrelatedCommits from "./features/fade-out-unrelated-commits";
 // import mergeWarning from "./features/merge-warning";
-// import parentPRSelect from "./features/parent-pr-select";
+import {
+  initializeHome,
+  initializeNewPullRequest
+} from "./features/parent-pr-select";
 // import showStackingInList from "./features/show-stacking-in-list";
 // import { setConfig } from "./lib/config";
-// import { createContext } from "./lib/context";
+import { createContext } from "./lib/context";
 
 // import { isPRView } from "./lib/location";
 import createRouter from "./lib/router";
 
 createRouter({
-  "/:owner/:repo/pulls": ({ repo, owner }: { repo: string; owner: string }) =>
-    console.log(repo, owner)
+  "/:owner/:repo/:prNumber": async ({ repo, owner, prNumber }) => {
+    const context = await createContext();
+    await initializeHome(context, { repo, owner, prNumber });
+  },
+  "/:owner/:repo/compare/*": async ({ repo, owner }) => {
+    const context = await createContext();
+    await initializeNewPullRequest(context, { repo, owner });
+  }
 });
 
 // async function run() {
@@ -23,7 +32,7 @@ createRouter({
 //   try {
 //     await diffSelect(context);
 //     await showStackingInList(context);
-//     await parentPRSelect(context);
+// await parentPRSelect(context);
 //     await fadeOutUnrelatedCommits(context);
 //     await mergeWarning(context);
 //   } catch (err) {

src/lib/context.ts

@@ -1,17 +1,13 @@
 import { AccessToken } from "../api";
 import { getConfig } from "../lib/config";
 export interface IStackerContext {
-  location: Location;
   accessToken: AccessToken | null;
 }
 
-export async function createContext(
-  location: Location
-): Promise<IStackerContext> {
+export async function createContext(): Promise<IStackerContext> {
   const accessToken = getConfig().token;
 
   return {
-    accessToken,
-    location
+    accessToken
   };
 }

src/lib/router.ts

@@ -12,13 +12,22 @@ export default function createRouter(routes: {
 
   const pushState = window.history.pushState;
 
+  function match(pathname: string) {
+    const route = router.match(pathname);
+    if (!route) {
+      return;
+    }
+    route.fn(route.params);
+  }
+
   window.history.pushState = (...args: any[]) => {
     const [, , url] = args;
-    console.log(parse(url).pathname);
-
-    console.log(router.match(parse(url).pathname));
-
+    const parts = parse(url);
+    if (parts.pathname) {
+      match(parts.pathname);
+    }
     return pushState.apply(history, args);
   };
-  console.log(router.match(location.pathname));
+
+  match(location.pathname);
 }