From df79a34120dfb1cec776a55acf685e16a17fffba Mon Sep 17 00:00:00 2001
From: MTG2000 <mtg0987654321@gmail.com>
Date: Tue, 8 Feb 2022 17:26:56 +0200
Subject: [PATCH] fix: fixing some issues from merging

---
 .storybook/preview.js                         |  6 +++--
 src/Components/Button/Button.tsx              |  7 +++--
 src/Components/Navbar/NavMobile.tsx           | 18 ++++++-------
 src/Components/Navbar/Navbar.tsx              | 16 ++++++------
 src/Components/TipButton/TipButton.tsx        | 26 +------------------
 src/index.tsx                                 | 19 +++-----------
 .../ProjectCard/ProjectCard.Skeleton.tsx      | 10 +++----
 .../ProjectPage/ProjectCard/ProjectCard.tsx   |  4 +--
 src/utils/Wrapper.tsx                         |  6 +++--
 src/utils/hoc.tsx                             | 14 ++++++++--
 10 files changed, 54 insertions(+), 72 deletions(-)

diff --git a/.storybook/preview.js b/.storybook/preview.js
index ea2f2e8..bd3ad23 100644
--- a/.storybook/preview.js
+++ b/.storybook/preview.js
@@ -21,11 +21,13 @@ import { BrowserRouter } from "react-router-dom";
 
 
 const client = new ApolloClient({
-  uri: 'https://deploy-preview-2--makers-bolt-fun.netlify.app/.netlify/functions/graphql',
+  uri: process.env.NODE_ENV === 'development' ?
+    'https://xenodochial-goldstine-d09942.netlify.app/.netlify/functions/graphql'
+    :
+    '/.netlify/functions/graphql',
   cache: new InMemoryCache()
 });
 
-
 export const parameters = {
   actions: { argTypesRegex: "^on[A-Z].*" },
   controls: {
diff --git a/src/Components/Button/Button.tsx b/src/Components/Button/Button.tsx
index d2f0af3..31f737c 100644
--- a/src/Components/Button/Button.tsx
+++ b/src/Components/Button/Button.tsx
@@ -9,6 +9,7 @@ interface Props {
     size?: 'sm' | 'md' | 'lg'
     children: ReactNode;
     href?: string;
+    newTab?: boolean;
     fullWidth?: boolean;
     onClick?: () => void;
     className?: string
@@ -53,7 +54,7 @@ const btnPadding: UnionToObjectKeys<Props, 'size'> = {
     lg: 'py-12 px-36 text-body4'
 }
 
-export default function Button({ color = 'white', variant = 'fill', isLoading, disableOnLoading = true, size = 'md', fullWidth, href, className, onClick, children, ...props }: Props) {
+export default function Button({ color = 'white', variant = 'fill', isLoading, disableOnLoading = true, size = 'md', fullWidth, href, newTab, className, onClick, children, ...props }: Props) {
 
     let classes = `
     inline-block font-sans rounded-lg font-regular border border-gray-300 hover:cursor-pointer
@@ -83,6 +84,8 @@ export default function Button({ color = 'white', variant = 'fill', isLoading, d
                 {/* {isLoading ? <Loading color={loadingColor[color]} /> : children} */}
                 {children}
             </button>
-            , href)
+            , href, {
+            newTab
+        })
     )
 }
diff --git a/src/Components/Navbar/NavMobile.tsx b/src/Components/Navbar/NavMobile.tsx
index 8a74841..0eece51 100644
--- a/src/Components/Navbar/NavMobile.tsx
+++ b/src/Components/Navbar/NavMobile.tsx
@@ -44,22 +44,22 @@ export default function NavMobile({ onSearch }: Props) {
 
   return (
     <nav className="block bg-white fixed top-0 left-0 w-full lg:hidden overflow-hidden z-[2010]">
-      <div className="p-16 px-32 w-screen flex justify-center items-center">
+      <div className="p-16 px-32 w-screen flex justify-between items-center">
         {/* <div className="w-40 h-40 bg-gray-100 rounded-8 mr-auto overflow-hidden">
                     <img className="w-full h-full object-cover" src="https://www.figma.com/file/OFowr5RJk9YZCW35KT7D5K/image/07b85d84145942255afd215b3da26dbbf1dd03bd?fuid=772401335362859303" alt="" />
                 </div> */}
         <Link to="/">
           <h2 className="text-h5 font-bold mx-auto">makers.bolt.fun</h2>
         </Link>
-        <a
+
+        <Button size="sm"
+          color="primary"
+          className=" rounded-24 ml-auto"
           href="https://form.jotform.com/220301236112030"
-          target="_blank"
-          rel="noreferrer"
-        >
-          <Button size="sm" color="primary" className=" rounded-24 ml-auto">
-            Submit App️
-          </Button>
-        </a>
+          newTab>
+          Submit App️
+        </Button>
+
         {/* <button className='rounded-full ml-auto text-2xl w-[50px] h-[50px] hover:bg-gray-200' onClick={handleClick}>
 
                     {!open ? (<motion.div key={open ? 1 : 0} variants={navBtnVariant} initial='menuHide' animate='menuShow'><FiMenu /></motion.div>)
diff --git a/src/Components/Navbar/Navbar.tsx b/src/Components/Navbar/Navbar.tsx
index 924920d..dd4476f 100644
--- a/src/Components/Navbar/Navbar.tsx
+++ b/src/Components/Navbar/Navbar.tsx
@@ -107,16 +107,16 @@ export default function Navbar() {
             animate={searchOpen ? { opacity: 0 } : { opacity: 1 }}
             className="flex"
           >
-            {" "}
-            <a
+
+            <Button
+              color="primary"
+              size="md"
+              className="lg:px-40"
               href="https://form.jotform.com/220301236112030"
-              target="_blank"
-              rel="noreferrer"
+              newTab
             >
-              <Button color="primary" size="md" className="lg:px-40">
-                Submit App️
-              </Button>
-            </a>
+              Submit App️
+            </Button>
             {/* {isWalletConnected ?
                             <Button className="ml-16 py-12 px-16 lg:px-20">Connected <AiFillThunderbolt className='inline-block text-thunder transform scale-125' /></Button>
                             : <Button className="ml-16 py-12 px-16 lg:px-20" onClick={onConnectWallet}><AiFillThunderbolt className='inline-block text-thunder transform scale-125' /> Connect Wallet </Button>
diff --git a/src/Components/TipButton/TipButton.tsx b/src/Components/TipButton/TipButton.tsx
index 8c97ea5..9678854 100644
--- a/src/Components/TipButton/TipButton.tsx
+++ b/src/Components/TipButton/TipButton.tsx
@@ -28,35 +28,11 @@ export default function TipButton({ onTip = () => { }, ...props }: Props) {
 
     const isMobileScreen = useAppSelector(s => s.theme.isMobileScreen)
 
-    // useEffect(() => {
-    //     setInterval(() => {
-    //         setTipCnt(s => s + 1)
-
-    //         const newSpark = {
-    //             id: Math.random().toString(),
-    //             offsetX: random(1, 99),
-    //             animation: randomItem('fly-spark-1', 'fly-spark-2'),
-    //             animationSpeed: randomItem(1, 1.5, 2),
-    //             color: randomItem('#ff6a00', '#ff7717', '#ff6217', '#ff8217', '#ff5717'),
-    //             scale: random(1, 2)
-    //         };
-    //         setTimeout(() => {
-    //             setSparks(s => {
-    //                 return s.filter(spark => spark.id !== newSpark.id)
-    //             })
-
-    //         }, newSpark.animationSpeed * 1000)
-
-    //         setSparks(oldSparks => [...oldSparks, newSpark])
-
-    //     }, 300);
-    // }, [])
-
 
     const { onPressDown, onPressUp } = usePressHolder(_throttle(() => {
         const _incStep = (Math.ceil((tipCnt + 1) / 10) + 1) ** 2 * 10;
         setIncStep(_incStep)
-        setTipCnt(s => { console.log('update'); return s + _incStep})
+        setTipCnt(s => s + _incStep)
 
         const newSpark = {
             id: Math.random().toString(),
diff --git a/src/index.tsx b/src/index.tsx
index 7822d07..a357eb6 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,28 +1,17 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import Wrapper from './utils/Wrapper';
-import {
-  ApolloClient,
-  InMemoryCache,
-  ApolloProvider,
-} from "@apollo/client";
 import './index.css';
 import App from './App';
 import reportWebVitals from './reportWebVitals';
 
-const client = new ApolloClient({
-  //uri: 'https://xenodochial-goldstine-d09942.netlify.app/.netlify/functions/graphql',
-  uri: '/.netlify/functions/graphql',
-  cache: new InMemoryCache()
-});
+
 
 ReactDOM.render(
   <React.StrictMode>
-    <ApolloProvider client={client}>
-      <Wrapper>
-        <App />
-      </Wrapper>
-    </ApolloProvider>
+    <Wrapper>
+      <App />
+    </Wrapper>
   </React.StrictMode>,
   document.getElementById('root')
 );
diff --git a/src/pages/ProjectPage/ProjectCard/ProjectCard.Skeleton.tsx b/src/pages/ProjectPage/ProjectCard/ProjectCard.Skeleton.tsx
index e382b33..079048b 100644
--- a/src/pages/ProjectPage/ProjectCard/ProjectCard.Skeleton.tsx
+++ b/src/pages/ProjectPage/ProjectCard/ProjectCard.Skeleton.tsx
@@ -50,15 +50,15 @@ export default function ProjectCardSkeleton({ onClose, direction, ...props }: Pr
                     </div>
 
                 </div>
-                <p className="mt-40 text-body4 leading-normal">
+                <p className="mt-40 text-body4 leading-normal h-[120px]">
 
-                    <Skeleton width='98%' />
+                    {/* <Skeleton width='98%' />
                     <Skeleton width='90%' />
                     <Skeleton width='70%' />
-                    <Skeleton width='40%' />
+                    <Skeleton width='40%' /> */}
                 </p>
 
-                <div className="mt-40">
+                {/* <div className="mt-40">
                     <h3 className="text-h5 font-bold mb-16">Screenshots</h3>
                     <div className="grid grid-cols-2 gap-12 justify-items-center md:gap-24">
                         <div className="w-full relative pt-[56%]">
@@ -74,7 +74,7 @@ export default function ProjectCardSkeleton({ onClose, direction, ...props }: Pr
                             <div className="absolute top-0 left-0 w-full h-full object-cover bg-gray-300 rounded-xl"></div>
                         </div>
                     </div>
-                </div>
+                </div> */}
 
             </div>
         </motion.div>
diff --git a/src/pages/ProjectPage/ProjectCard/ProjectCard.tsx b/src/pages/ProjectPage/ProjectCard/ProjectCard.tsx
index f7c137f..92fa476 100644
--- a/src/pages/ProjectPage/ProjectCard/ProjectCard.tsx
+++ b/src/pages/ProjectPage/ProjectCard/ProjectCard.tsx
@@ -96,7 +96,7 @@ export default function ProjectCard({ onClose, direction, projectId, ...props }:
                         </div>
                     </div>
                     <div className="flex-shrink-0  hidden md:flex ml-auto gap-16">
-                        <Button color='primary' size='md' className=" my-16" onClick={() => { window.open(project?.website)} }>Visit <BsJoystick /></Button>
+                        <Button color='primary' size='md' className=" my-16" href={project.website} newTab >Visit <BsJoystick /></Button>
                         {isWalletConnected ?
                             <TipButton onTip={onTip} />
                             :
@@ -106,7 +106,7 @@ export default function ProjectCard({ onClose, direction, projectId, ...props }:
                 </div>
                 <p className="mt-40 text-body4 leading-normal">{project?.description}</p>
                 <div className="md:hidden">
-                    <Button color='primary' size='md' fullWidth onClick={() => { window.open(project?.website)} } className="w-full mt-24 mb-16">Visit <BsJoystick /></Button>
+                    <Button color='primary' size='md' fullWidth href={project.website} newTab className="w-full mt-24 mb-16">Visit <BsJoystick /></Button>
                     {isWalletConnected ?
                         <TipButton fullWidth onTip={onTip} />
                         :
diff --git a/src/utils/Wrapper.tsx b/src/utils/Wrapper.tsx
index 6b0402c..fd05bc1 100644
--- a/src/utils/Wrapper.tsx
+++ b/src/utils/Wrapper.tsx
@@ -15,8 +15,10 @@ import {
 } from "@apollo/client";
 
 const client = new ApolloClient({
-    //uri: 'https://deploy-preview-2--makers-bolt-fun.netlify.app/.netlify/functions/graphql',
-    uri: '/.netlify/functions/graphql',
+    uri: process.env.NODE_ENV === 'development' ?
+        'https://xenodochial-goldstine-d09942.netlify.app/.netlify/functions/graphql'
+        :
+        '/.netlify/functions/graphql',
     cache: new InMemoryCache()
 });
 
diff --git a/src/utils/hoc.tsx b/src/utils/hoc.tsx
index 1edec0c..3181448 100644
--- a/src/utils/hoc.tsx
+++ b/src/utils/hoc.tsx
@@ -1,10 +1,20 @@
 import { Link } from "react-router-dom";
 
 
-export function wrapLink(Component: JSX.Element, href: string | undefined, className?: string) {
+export function wrapLink(Component: JSX.Element, href: string | undefined, options: { className?: string, newTab?: boolean } = {}) {
     if (!href) return Component;
 
-    return <Link to={href} className={className}>
+    if (options.newTab)
+        return <a
+            href={href}
+            className={options.className}
+            target="_blank" rel="noopener noreferrer" >
+            {Component}
+        </a>
+
+    return <Link
+        to={href}
+        className={options.className} >
         {Component}
     </Link>
 }
\ No newline at end of file