Merge pull request #29 from NEARBuilders/fix-flashes

Fix flashes in UI
NEARBuilders · Jan 9, 2024 · 04b97b3 · 04b97b3
2 parents 9226d18 + f923056
commit 04b97b3
Show file tree

Hide file tree

Showing 10 changed files with 54 additions and 31 deletions.
diff --git a/apps/builddao/widget/Aside.jsx b/apps/builddao/widget/Aside.jsx
@@ -20,7 +20,7 @@ const AsideContainer = styled.div`
 `;
 
 const { Button } =
-  VM.require("buildhub.near/widget/components.Button") || (() => {});
+  VM.require("buildhub.near/widget/components.Button") || (() => <></>);
 
 const { routes, active, setActiveRoute } = props;
 

diff --git a/apps/builddao/widget/Compose.jsx b/apps/builddao/widget/Compose.jsx
@@ -1,5 +1,8 @@
 const { Avatar, Button } = VM.require("buildhub.near/widget/components");
 
+Avatar = Avatar || (() => <></>);
+Button = Button || (() => <></>);
+
 const draftKey = props.feed.name || "draft";
 const draft = Storage.privateGet(draftKey);
 

diff --git a/apps/builddao/widget/Resources.jsx b/apps/builddao/widget/Resources.jsx
@@ -1,4 +1,5 @@
-const { MarkdownView } = VM.require("buildhub.near/widget/md-view");
+const { MarkdownView } =
+  VM.require("buildhub.near/widget/md-view") || (() => <></>);
 
 const Container = styled.div`
   display: grid;

diff --git a/apps/builddao/widget/components/Library.jsx b/apps/builddao/widget/components/Library.jsx
@@ -13,6 +13,19 @@ const {
   Checkbox,
 } = VM.require("buildhub.near/widget/components");
 
+Button = Button || (() => <></>);
+Pagination = Pagination || (() => <></>);
+ProgressState = ProgressState || (() => <></>);
+Step = Step || (() => <></>);
+Post = Post || (() => <></>);
+InputField = InputField || (() => <></>);
+UploadField = UploadField || (() => <></>);
+TextBox = TextBox || (() => <></>);
+TextEditor = TextEditor || (() => <></>);
+User = User || (() => <></>);
+Avatar = Avatar || (() => <></>);
+Checkbox = Checkbox || (() => <></>);
+
 // states
 const [checked, setChecked] = useState(false);
 

diff --git a/apps/builddao/widget/components/Post.jsx b/apps/builddao/widget/components/Post.jsx
@@ -1,4 +1,6 @@
-const { User, BookmarkButton } = VM.require("buildhub.near/widget/components");
+const { User } = VM.require("buildhub.near/widget/components");
+
+User = User || (() => <></>);
 
 const StyledPost = styled.div`
   margin-bottom: 1rem;

diff --git a/apps/builddao/widget/components/Step.jsx b/apps/builddao/widget/components/Step.jsx
@@ -1,28 +1,29 @@
-const { ProgressState } = VM.require("buildhub.near/widget/components.ProgressState");
+const { ProgressState } =
+  VM.require("buildhub.near/widget/components.ProgressState") || (() => <></>);
 
 const StepContainer = styled.div`
-    position: relative;
+  position: relative;
+
+  &::before {
+    content: "";
+    position: absolute;
+    top: 50%;
+    left: 0;
+    right: 0;
+    height: 1px;
+    background: #000; /* Change color as needed */
+    background-image: repeating-linear-gradient(
+      90deg,
+      #3c3d43,
+      #3c3d43 2px,
+      transparent 2px,
+      transparent 4px
+    );
+    transform: translateY(-50%);
+    z-index: -1;
+  }
+`;
 
-    &::before {
-      content: "";
-      position: absolute;
-      top: 50%;
-      left: 0;
-      right: 0;
-      height: 1px;
-      background: #000; /* Change color as needed */
-      background-image: repeating-linear-gradient(
-        90deg,
-        #3c3d43,
-        #3c3d43 2px,
-        transparent 2px,
-        transparent 4px
-      );
-      transform: translateY(-50%);
-      z-index: -1;
-    }
-  `;
-
 function Step(props) {
   const totalSteps = props.totalSteps ?? 5;
   const currentStep = props.currentStep ?? 3;
@@ -52,4 +53,4 @@ function Step(props) {
   );
 }
 
-return { Step };
+return { Step };
diff --git a/apps/builddao/widget/components/UploadField.jsx b/apps/builddao/widget/components/UploadField.jsx
@@ -1,4 +1,5 @@
-const { Button } = VM.require("buildhub.near/widget/components.Button");
+const { Button } =
+  VM.require("buildhub.near/widget/components.Button") || (() => <></>);
 
 const UploadContainer = styled.div`
   display: flex;
@@ -60,4 +61,4 @@ function UploadField({ background }) {
   );
 }
 
-return { UploadField };
+return { UploadField };
diff --git a/apps/builddao/widget/components/User.jsx b/apps/builddao/widget/components/User.jsx
@@ -1,4 +1,5 @@
-const { Avatar } = VM.require("buildhub.near/widget/components");
+const { Avatar } =
+  VM.require("buildhub.near/widget/components") || (() => <></>);
 
 const Button = styled.div`
   line-height: 20px;

diff --git a/apps/builddao/widget/resources-aside.jsx b/apps/builddao/widget/resources-aside.jsx
@@ -1,4 +1,5 @@
-const { Button } = VM.require("buildhub.near/widget/components");
+const { Button } =
+  VM.require("buildhub.near/widget/components") || (() => <></>);
 
 const Container = styled.div`
   border-radius: 16px;

diff --git a/apps/embeds/widget/Feed.jsx b/apps/embeds/widget/Feed.jsx
@@ -1,4 +1,4 @@
-const { Feed } = VM.require("devs.near/widget/Module.Feed");
+const { Feed } = VM.require("devs.near/widget/Module.Feed") || (() => <></>);
 
 Feed = Feed || (() => <></>); // make sure you have this or else it can break