fix: follow docs 2 get sign in flow w/ outseta #12

gatsby-node.js

@@ -21,21 +21,18 @@ exports.createPages = async ({ graphql, actions }) => {
         }
     }`)
     console.log(data.bakingSupplies.edges);
-    data.bakingSupplies.edges.forEach(windowFullOfBabySharkCookies => {
+    data.bakingSupplies.edges.forEach(ahoyCookie => {
       actions.createPage({
-//              A. 🦊 «Ahoy! A path?!» Shouts Fox and embarks.
-// A windowFullOfBabySharkCookies
-//              A. 🦊 «Ahoy! A windowFullOfBabySharkCookies ?!» Barks Fox and embarks.
-        path: `${windowFullOfBabySharkCookies.node.name}`,
-// //              B. 🐰 Bunny sings badly and bakes all the sharks.
-// //              B. is for bakingSong, sung badly by 🐰 Bunny who bakes bad babySharks.
+//              A. 🦊 «Ahoy! Cookie?!» Shouts Fox and embarks.
+        path: `${ahoyCookie.node.name}`,
+//              B. 🐰 Bunny sings badly and bakes baby sharks.
         component: bakingSong,
-// //              C. 🐯 is the context: { fox: 'is hungry for kitten' }
+//              C. 🐯 is the context: { fox: 'is hungry for kitten' }
         context: {
           fox: 'is hungry for kitten',
-          id: windowFullOfBabySharkCookies.node.id,  //babySharkBatch.localFile.id,
+          id: ahoyCookie.node.id,  //babySharkBatch.localFile.id,
         },
-//              D. 🎩 They defer the good cookies and maybe get bitten
+//              D. 🎩 Defer the good cookies and maybe get bitten
 //              Where are the nodes?
 //console.log(data);
 //              3. Loop over the image nodes and for each create a page

gatsby-ssr.js

@@ -0,0 +1,36 @@
+// gatsby-ssr.js console.log('pop Up from your box 🃏 joker 🃏 ')
+import React from "react";
+const OutsetaScriptComponent = () => {
+  return (
+    <script
+      key="outseta-script"
+      id="outseta-script"
+      src="https://cdn.outseta.com/outseta.min.js"
+      // data-options="o_options"
+    />
+  );
+};
+
+const OusetaConfigComponent = () => {
+  const config = {
+    domain: "timeship.outseta.com",
+    monitorDom: true,
+  };
+  return (
+    <script
+      key="outseta-config"
+      id="outseta-config"
+      dangerouslySetInnerHTML={{
+        __html: `var o_options = ${JSON.stringify(config, null, 2)}`,
+      }}
+    />
+  );
+};
+
+
+const onRenderBody = ({ setHeadComponents }) => {
+return setHeadComponents([OutsetaScriptComponent(), /*OusetaConfigComponent()*/]);
+};
+export { onRenderBody };
+
+

src/pages/index.js

@@ -27,18 +27,35 @@ const IndexPage = () => {
   };
 
   const isDisabled = status === "pending";
-
+  // function popUpOutseta(){
+  //   console.log('pop Up from your box 🃏 joker 🃏 ')
+  // }
   return (
     <main>
+    <div>
+    <a href="href=https://timeship.outseta.com/auth?widgetMode=register#o-anonymous">Pop up from your box 🃏 sign-up joker 🃏 </a>
+      <br />
+      <br />
+    <a href="https://timeship.outseta.com/auth?widgetMode=login#o-anonymous">Pop up from your box 🃏 login joker 🃏 </a>
+      <br />
+      <br />
+    <a href="https://timeship.outseta.com/profile#o-authenticated">Pop up from your box 🃏 profile joker 🃏 </a>
+      <br />
+      <br />
+    <a href="/#o-logout-link">Pop up from your box 🃏 log out joker 🃏 </a>
+    <br />
+    <br />
+    </div>
       <header>
         <h1>Ruby's TimeShip</h1>
         <p>
-          Your mission: Locate The Pirate Princess Lillian at the age of 11, so
+          Your mission: Stop your enemies from locating Lillian The Pirate Princess before you. So
           you can bring her back to 1554 and save Ruby's sister, Princess
           Lizabeth from prison.
         </p>
       </header>
 
+
       <form onSubmit={handleSubmit}>
         <fieldset disabled={isDisabled}>
           <p>

src/pages/sign-up.js

@@ -0,0 +1,23 @@
+import React from "react";
+
+
+function popUpFromYourBoxSignUpJoker() {
+    // bleh
+    console.log('pop up from your box 🃏 sign up joker 🃏')
+    // Add
+    // href="https://timeship.outseta.com/auth?widgetMode=register#o-anonymous"
+}
+
+const SignUpPage = () => {
+    return (
+        <div>
+            <button
+                href="https://timeship.outseta.com/auth?widgetMode=register#o-anonymous"
+                type="button"
+                onClick={popUpFromYourBoxSignUpJoker}
+            >🃏 sign up 🃏</button>
+        </div>
+    )
+};
+
+export default SignUpPage