add landing page

src/Routes.tsx

@@ -1,14 +1,16 @@
 import { Routes as Router, Route } from "react-router-dom";
 
-import Home from "./pages/Home";
+import Summon from "./pages/Summon";
 import Success from "./pages/Success";
 import { LayoutContainer } from "./components/LayoutContainer";
+import Landing from "./pages/Landing";
 
 export const Routes = () => {
   return (
     <Router>
       <Route path="/" element={<LayoutContainer />}>
-        <Route index element={<Home />} />
+        <Route index element={<Landing />} />
+        <Route path={`summon/:tag`} element={<Summon/>} />
         <Route path={`success/:daoId`} element={<Success />} />
       </Route>
     </Router>

src/components/customFields/ParamTag.tsx

@@ -0,0 +1,19 @@
+import { useEffect } from "react";
+import { useFormContext } from "react-hook-form";
+
+import { Buildable, Field } from "@daohaus/ui";
+
+import { useParams } from "react-router-dom";
+
+export const ParamTag = (props: Buildable<Field>) => {
+  const { setValue } = useFormContext();
+  // use params tag
+  const { tag } = useParams();
+  useEffect(() => {
+    if (tag == "personal" || tag == "topic") {
+      setValue(props.id, tag);
+    }
+  }, [tag]);
+
+  return null;
+};

src/legos/fieldConfig.ts

@@ -8,6 +8,7 @@ import { ManagerAddress } from "../components/customFields/ManagerAddress";
 import { SaltNonce } from "../components/customFields/SaltNonce";
 import { DAOAddress } from "../components/customFields/DAOAddress";
 import { ShamanAddress } from "../components/customFields/ShamanAddress";
+import { ParamTag } from "../components/customFields/ParamTag";
 
 export const AppFieldLookup = {
   ...MolochFields,
@@ -18,7 +19,8 @@ export const AppFieldLookup = {
   managerAddress: ManagerAddress,
   daoAddress: DAOAddress,
   shamanAddress: ShamanAddress,
-  saltNonce: SaltNonce
+  saltNonce: SaltNonce,
+  paramTag: ParamTag
 };
 
 export type CustomFieldLego = FieldLegoBase<typeof AppFieldLookup>;

src/legos/fields.ts

@@ -35,4 +35,8 @@ export const APP_FIELD: Record<string, CustomFieldLego> = {
     id: "calculatedShamanAddress",
     type: "shamanAddress",
   },
+  PARAM_TAG_FIELD: {
+    id: "paramTag",
+    type: "paramTag",
+  },
 };

src/legos/forms.ts

@@ -66,6 +66,7 @@ export const APP_FORM: Record<string, CustomFormLego> = {
       APP_FIELD.SALT_NONCE_FIELD,
       APP_FIELD.DAO_ADDRESS_FIELD,
       APP_FIELD.SHAMAN_ADDRESS_FIELD,
+      APP_FIELD.PARAM_TAG_FIELD,
       {
         id: "parentCheckGateRender",
         type: "checkGateRender",

src/main.tsx

@@ -16,7 +16,7 @@ import "./App.css";
 // // Related open issue: https://github.com/WalletConnect/walletconnect-monorepo/issues/748
 // window.Buffer = window.Buffer || Buffer;
 
-const supportedNetorks = {
+export const supportedNetorks = {
   // "0x5": HAUS_NETWORK_DATA["0x5"],
   // "0x1": HAUS_NETWORK_DATA["0x1"],
   // "0xa": HAUS_NETWORK_DATA["0xa"],

src/pages/Landing.tsx

@@ -0,0 +1,89 @@
+
+import { useDHConnect } from "@daohaus/connect";
+import styled from "styled-components";
+import { BiColumnLayout, Button, Link } from "@daohaus/ui";
+import { Link as RouterLink } from "react-router-dom";
+import { supportedNetorks } from "../main";
+import { ADMIN_URL } from "../utils/constants";
+
+const LinkButton = styled(RouterLink)`
+  text-decoration: none;
+`;
+
+const ExternalLinkButton = styled(Link)`
+  text-decoration: none;
+  color: unset;
+  &:hover {
+    text-decoration: none;
+  }
+`;
+
+
+const Landing = () => {
+  const { chainId, isConnected } = useDHConnect();
+
+  return (
+    <>
+      {chainId && chainId in supportedNetorks ? (
+        <BiColumnLayout left={(
+          <div>
+            <h1>Create Topic Hub</h1>
+            <p>
+              Create a topic hub to organize and fund projects, events, and more.
+            </p>
+            <LinkButton to="/summon/topic">
+              <Button variant="outline">Summon a Topic</Button>
+            </LinkButton>
+          </div>
+        )}
+          right={(
+            <div>
+              <h2>Create Personal Hub</h2>
+              <p>
+                The fun starts with your own personal hub.
+              </p>
+              <p>TODO: if a personal hub already exists display info and a link to it here, otherwise link to summon form. This may need to be queried through dao name or tag, and summoner</p>
+
+              <LinkButton to={`/summon/personal`} >
+                <Button variant="outline">Summon a Personal Hub</Button>
+              </LinkButton>
+              <ExternalLinkButton
+                showExternalIcon={true}
+                target="_blank"
+                href={`${ADMIN_URL}`}
+              >
+                Continue To Topic List
+              </ExternalLinkButton>
+            </div>
+          )}
+        >
+
+        </BiColumnLayout>
+      ) :
+        (
+          <div>
+            {!isConnected && (<><h1>Not Connected</h1>
+              <p>
+                Please connect your wallet to continue.
+              </p>
+            </>
+            )}
+            {isConnected && (
+              <h1>Unsupported Network. Switch to sepolia</h1>
+            )}
+            <ExternalLinkButton
+                showExternalIcon={true}
+                target="_blank"
+                href={`${ADMIN_URL}`}
+              >
+                Continue To Topic List
+              </ExternalLinkButton>
+          </div>)
+      }
+
+    </>
+
+  );
+};
+
+export default Landing;

src/pages/Home.tsx → src/pages/Summon.tsx

@@ -1,12 +1,12 @@
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
 
 import { FormBuilder } from "@daohaus/form-builder";
 import { APP_FORM } from "../legos/forms";
 import { AppFieldLookup } from "../legos/fieldConfig";
 import { useDHConnect } from "@daohaus/connect";
 import { useState } from "react";
 import styled from "styled-components";
-import { Link } from "@daohaus/ui";
+import { Link, SingleColumnLayout } from "@daohaus/ui";
 import { ADMIN_URL } from "../utils/constants";
 
 const LinkButton = styled(Link)`
@@ -17,7 +17,7 @@ const LinkButton = styled(Link)`
   }
 `;
 
-const Home = () => {
+const Summon = () => {
   const navigate = useNavigate();
   const { chainId } = useDHConnect();
   const [txSuccess, setTxSuccess] = useState(false);
@@ -36,7 +36,7 @@ const Home = () => {
   console.log("chainId", chainId);
 
   return (
-    <>
+    <SingleColumnLayout>
       <FormBuilder
         form={APP_FORM.SUMMON_CURATOR_NFT}
         customFields={AppFieldLookup}
@@ -57,10 +57,10 @@ const Home = () => {
         target="_blank"
         href={`${ADMIN_URL}`}
       >
-        Go to Hub
+        Go to Topic List
       </LinkButton>}
-    </>
+    </SingleColumnLayout>
   );
 };
 
-export default Home;
+export default Summon;

src/utils/constants.ts

@@ -43,7 +43,7 @@ export const CURATOR_CONTRACTS: KeychainList = {
   },
   NFT_CURATOR_SINGLETON: {
     // "0x5": "0xb3dc8207075e9c7e78efb7148fb59b6f5da1dc28"
-    "0xaa36a7": "0xeece40a7492efe0598e466ff501530feaddd501d", // "0x31cb4b142ed082147d4c71da0c3bbef0b6c0f3ae"
+    "0xaa36a7": "0xec0d1f8baed05ed6516fe0f9304566115f2dbbde", // "0xeece40a7492efe0598e466ff501530feaddd501d", // "0x31cb4b142ed082147d4c71da0c3bbef0b6c0f3ae"
   },
   CLAIM_SHAMAN_SINGLETON: {
     // "0x1": "0x80daee7a5322fbeb3f0f72531fdab5ed0f3e7333",

src/utils/summonTx.ts

@@ -355,7 +355,7 @@ function assembleInitialContent(
   const content = { 
                 name: name,
                 daoId: calculatedDAOAddress || "0x00000000",
-                table: 'daoProfile', // 'DIN',
+                table: 'daoProfile', 
                 queryType: 'list',
                 title: `${daoName} Incarnation`,
                 description: body,
@@ -459,11 +459,11 @@ const tokenConfigTX = () => {
 
 const tokenDistroTX = (formValues: SummonParams , memberAddress: EthAddress) => {
 
-  const shamanAddress = formValues.calculatedShamanAddress;
+  // const shamanAddress = formValues.calculatedShamanAddress;
 
   const encoded = encodeFunction(LOCAL_ABI.BAAL, "mintShares", [
-    [memberAddress, shamanAddress],
-    ["10000000000000000000", "10000000000000000000"]
+    [memberAddress],
+    ["10000000000000000000"]
   ]);
 
   if (isString(encoded)) {
@@ -497,7 +497,7 @@ const introPostConfigTX = (formValues: SummonParams, memberAddress: EthAddress,
 };
 
 const metadataConfigTX = (formValues: Record<string, unknown>, memberAddress: EthAddress, posterAddress: string) => {
-  const { daoName, calculatedDAOAddress, article: body, headerImage, description } = formValues;
+  const { daoName, calculatedDAOAddress, article: body, headerImage, description, paramTag } = formValues;
   if (!isString(daoName)) {
     console.log("ERROR: Form Values", formValues);
     throw new Error("metadataTX recieved arguments in the wrong shape or type");
@@ -507,13 +507,13 @@ const metadataConfigTX = (formValues: Record<string, unknown>, memberAddress: Et
   const content = { 
                 name: daoName,
                 daoId: calculatedDAOAddress,
-                table: 'daoProfile', // 'DIN',
+                table: 'daoProfile', 
                 queryType: 'list',
                 description: description || "",
                 longDescription: body || "",
                 avatarImg: headerImage || "",
                 title: `${daoName} Incarnation`,
-                tags: ["DIN", "Incarnation"],
+                tags: ["DIN", "Incarnation", paramTag || "topic"],
                 authorAddress: memberAddress,
                 // parentId: 0
               };