feature: tab links

package.json

@@ -11,7 +11,7 @@
     "fmt": "prettier --write '**/*.{js,jsx,ts,tsx,json}'",
     "fmt:check": "prettier --check '**/*.{js,jsx,ts,tsx,json}'",
     "build": "npm run fmt && node ./module/include.js",
-    "dev": "~/.cargo/bin/bos-loader thomaspreview.testnet --path src",
+    "dev": "~/.cargo/bin/bos-loader devhub.efiz.testnet --path src",
     "test": "npx playwright test"
   },
   "repository": {

src/DevHub/App.jsx

@@ -13,7 +13,7 @@ const {
 // THESE ARE TEMPORARY
 // This can be solved with injection during build
 if (!nearDevGovGigsWidgetsAccountId) {
-  nearDevGovGigsWidgetsAccountId = "thomaspreview.testnet";
+  nearDevGovGigsWidgetsAccountId = "devhub.efiz.testnet";
 }
 if (!nearDevGovGigsContractAccountId) {
   nearDevGovGigsContractAccountId = "thomaspreview.testnet";

src/DevHub/components/molecule/PostControls.jsx

@@ -0,0 +1,28 @@
+const { className, title, icon, href, onClick } = props;
+
+const buttonStyle = {
+  backgroundColor: "#0C7283",
+  color: "#f3f3f3",
+};
+
+return (
+  <div class="d-flex flex-row-reverse" className={props.className}>
+    {props.href ? (
+      <a class="btn btn-light" style={buttonStyle} href={props.href}>
+        <i
+          class="bi"
+          className={props.icon ? props.icon : "bi-plus-circle-fill"}
+        ></i>
+        {props.title}
+      </a>
+    ) : (
+      <button class="btn btn-light" style={buttonStyle} onClick={props.onClick}>
+        <i
+          class="bi"
+          className={props.icon ? props.icon : "bi-plus-circle-fill"}
+        ></i>
+        {props.title || "Post"}
+      </button>
+    )}
+  </div>
+);

src/DevHub/entity/community/Blog.jsx

@@ -1,101 +1,49 @@
-// const { nearDevGovGigsWidgetsAccountId } = props;
-/* INCLUDE: "common.jsx" */
-const nearDevGovGigsContractAccountId =
-  props.nearDevGovGigsContractAccountId ||
-  (context.widgetSrc ?? "devgovgigs.near").split("/", 1)[0];
 
-const nearDevGovGigsWidgetsAccountId =
-  props.nearDevGovGigsWidgetsAccountId ||
-  (context.widgetSrc ?? "devgovgigs.near").split("/", 1)[0];
-
-function widget(widgetName, widgetProps, key) {
-  widgetProps = {
-    ...widgetProps,
-    nearDevGovGigsContractAccountId: props.nearDevGovGigsContractAccountId,
-    nearDevGovGigsWidgetsAccountId: props.nearDevGovGigsWidgetsAccountId,
-    referral: props.referral,
-  };
-
-  return (
-    <Widget
-      src={`${nearDevGovGigsWidgetsAccountId}/widget/gigs-board.${widgetName}`}
-      props={widgetProps}
-      key={key}
-    />
-  );
-}
-
-function href(widgetName, linkProps) {
-  linkProps = { ...linkProps };
-
-  if (props.nearDevGovGigsContractAccountId) {
-    linkProps.nearDevGovGigsContractAccountId =
-      props.nearDevGovGigsContractAccountId;
-  }
-
-  if (props.nearDevGovGigsWidgetsAccountId) {
-    linkProps.nearDevGovGigsWidgetsAccountId =
-      props.nearDevGovGigsWidgetsAccountId;
-  }
-
-  if (props.referral) {
-    linkProps.referral = props.referral;
-  }
-
-  const linkPropsQuery = Object.entries(linkProps)
-    .filter(([_key, nullable]) => (nullable ?? null) !== null)
-    .map(([key, value]) => `${key}=${value}`)
-    .join("&");
-
-  return `/#/${nearDevGovGigsWidgetsAccountId}/widget/gigs-board.pages.${widgetName}${
-    linkPropsQuery ? "?" : ""
-  }${linkPropsQuery}`;
-}
-/* END_INCLUDE: "common.jsx" */
-
-const FeedPage = ({ author, recency, tag }) => {
-  State.init({
-    initial: { author, tag },
-    author,
-    tag,
-  });
-
-  // When rerendered with different props, State will be preserved, so we need to update the state when we detect that the props have changed.
-  if (tag !== state.initial.tag || author !== state.initial.author) {
-    State.update((lastKnownState) => ({
-      ...lastKnownState,
-      initial: { author, tag },
-      author,
-      tag,
-    }));
-  }
-
-  const onTagSearch = (tag) => {
-    State.update((lastKnownState) => ({ ...lastKnownState, tag }));
-  };
+// State.init({
+//   initial: { author, tag },
+//   author,
+//   tag,
+// });
+
+const [author, setAuthor] = useState(props.author || "");
+const [tag, setTag] = useState(props.tag || "");
+
+// // When rerendered with different props, State will be preserved, so we need to update the state when we detect that the props have changed.
+// if (tag !== state.initial.tag || author !== state.initial.author) {
+//   State.update((lastKnownState) => ({
+//     ...lastKnownState,
+//     initial: { author, tag },
+//     author,
+//     tag,
+//   }));
+// }
+
+const onTagSearch = (tag) => {
+  setTag(tag);
+};
 
-  const onAuthorSearch = (author) => {
-    State.update((lastKnownState) => ({ ...lastKnownState, author }));
-  };
-  return (
-    <Widget
-      src={`${nearDevGovGigsWidgetsAccountId}/widget/DevHub.entity.post.Panel`}
-      props={{
-        author: state.author,
-        authorQuery: { author: state.author },
-        children: widget("components.layout.Controls", {
-          title: "Post",
-          href: href("Create"),
-        }),
-        onAuthorSearch,
-        onTagSearch,
-        recency,
-        tag: state.tag,
-        tagQuery: { tag: state.tag },
-        transactionHashes: props.transactionHashes,
-      }}
-    />
-  );
+const onAuthorSearch = (author) => {
+  setAuthor(author);
 };
 
-return FeedPage(props);
+return (
+  <Widget
+    src={`${nearDevGovGigsWidgetsAccountId}/widget/DevHub.entity.post.Panel`}
+    props={{
+      author: author,
+      authorQuery: { author },
+      children: (
+        <Widget
+          src={`${nearDevGovGigsWidgetsAccountId}/widget/DevHub.components.molecule.PostControls`}
+          props={{ title: "Post", link: "Create" }}
+        />
+      ),
+      onAuthorSearch,
+      onTagSearch,
+      recency,
+      tag: tag,
+      tagQuery: { tag },
+      transactionHashes: props.transactionHashes,
+    }}
+  />
+);

src/DevHub/pages/community/index.jsx

@@ -148,13 +148,12 @@ return (
         />
       </div>
     </div>
-
     <NavUnderline className="nav">
       {tabs.map(({ defaultActive, params, route, title }) =>
         title ? (
           <li className="nav-item" key={title}>
             <Link
-              to={`&tab=${title}`}
+              to={`/${nearDevGovGigsWidgetsAccountId}/widget/DevHub.App?page=community&handle=${handle}&tab=${title}`}
               aria-current={defaultActive && "page"}
               className={[
                 "d-inline-flex gap-2",