dismiss sticky footer

components/Editor/CustomExtensions/Figure/ImageParts/OutgoingImageLinkRadix.jsx

@@ -1,7 +1,7 @@
 import React, {useState} from 'react';
 import { styled, keyframes } from '@stitches/react';
 import { violet, mauve, blackA, slate } from '@radix-ui/colors';
-import { MixerHorizontalIcon, Cross2Icon } from '@radix-ui/react-icons';
+import { Cross2Icon } from '@radix-ui/react-icons';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import ImageLinkField from './ImageLinkField/ImageLinkField'
 

components/ProfileBadge.js

@@ -227,7 +227,7 @@ export const ProfileBadgeDropdown = ({ icon, user }) => {
           >
             <DropdownMenuItem
               onSelect={() => {
-                if(user?.approved){
+                if(user?.profile?.approved){
                   router.push(`/people/${user?.profile?.slug}`);
                 }else{
                   router.push(`/account/profile`);

components/StickyFooterCTA.js

@@ -3,6 +3,8 @@ import { useEffect, useState } from "react";
 import Button from "./Primitives/Button";
 import Link from "next/link";
 import Container from "./container";
+import { Cross2Icon } from '@radix-ui/react-icons';
+import { set, get } from 'js-cookie';
 
 function getScrollPercent() {
     var h = document.documentElement,
@@ -13,23 +15,49 @@ function getScrollPercent() {
   }
 
 
-const StickyFooterCTA = ({title, description, buttonText}) => {
+  const StickyFooterCTA = ({ title, description, buttonText }) => {
     const [isVisible, setVisible] = useState(false);
+    const [userClosed, setUserClosed] = useState(false);
 
+    // Define the scrollListener inside useEffect or use useCallback
     useEffect(() => {
-      window.addEventListener("scroll", (event) => {
-        const p = getScrollPercent();
+      const scrollListener = () => {
+        const p = getScrollPercent(); // Assuming getScrollPercent is defined elsewhere
 
         if (p > 18 && p < 85) {
-          setVisible(true);
+          if (!userClosed) {
+            setVisible(true);
+          }
         } else {
           setVisible(false);
         }
-      });
-    }, []);
+      };
+
+      // Check if the user has already closed the sticky footer
+      const closed = get('closed-signup') === 'true';
+      console.log(closed);
+
+      if (!closed) {
+        window.addEventListener("scroll", scrollListener);
+      } else {
+        setUserClosed(true);
+      }
+
+      // Clean up function
+      return () => {
+        window.removeEventListener("scroll", scrollListener);
+      };
+    }, [userClosed]); // Re-attach the event listener if userClosed changes
+
+    const closeStickyFooter = () => {
+      setVisible(false);
+      set('closed-signup', 'true', { expires: 365 }); // Set a cookie to remember the user's choice, assuming a 1-year expiration
+      setUserClosed(true);
+    };
 
     return (
       <div className="w-full flex justify-center relative ">
+
         <motion.div
           initial="hidden"
           animate={isVisible ? "visible" : "hidden"}
@@ -50,7 +78,12 @@ const StickyFooterCTA = ({title, description, buttonText}) => {
           className="fixed bottom-0 w-full md:bottom-3 bg-gradient-to-t shadow-md overflow- from-blue-50 border border-indigo-900/10 to-white md:w-[80%] md:max-w-[1120px] md:rounded-2xl h-auto z-[100]"
         >
               <img src={`/static/images/robo2.png`} className="w-[76px] md:w-[104px] drop-shadow-xl z-40 ml-4 md:ml-0 left-0 absolute bottom-0 -mb-[15px] md:-mb-[25px] -scale-x-100"/>
-          <Container  maxWidth="max-w-[1320px] z-30 relative overflow-hidden">
+          <Container  maxWidth="max-w-[1320px] z-30 relative overflow-">
+            <div onClick={closeStickyFooter} className="rounded-full cursor-pointer z-50 w-[22px] flex flex-col justify-center h-[22px] shadow-sm border border-gray-300 absolute top-0 bg-white right-0 -mt-[6px] -mr-[6px]">
+              <div className="mx-auto">
+                <Cross2Icon width={14}/>
+              </div>
+            </div>
               <div  className="absolute top-0 left-0 w-full h-full md:rounded-2xl -ml-0.5 -mt-0.5" style={{"backgroundColor":"#ffffff","opacity":"0.1","backgroundImage":"linear-gradient(#203490 1.5px, transparent 1.5px), linear-gradient(to right, #203490 1.5px, #ffffff 1.5px)","backgroundSize":"30px 30px"}}/>
 
             <div className="w-full z-10 relative px-1 py-3  flex flex-col gap-4 md:gap-3 md:flex-row justify-between">

components/people/ProfilePageLayout.js

@@ -125,7 +125,7 @@ const ProfilePageLayout = ({
                     // </Link>
                     )}
                 </div>
-                <div className="flex flex-col z-20 relative justify-center">
+                <div className="flex flex-col z-20 relative justify-center max-w-lg">
                   <h1 className="text-2xl font-semibold leading-normal text-black/90">
                       {`${author?.firstName ? author?.firstName:'New'} ${author?.lastName ? author?.lastName:'User'}
                       ${((!author?.firstName && !author?.lastName) && author?.name) ? author?.name:''}`}

pages/api/auth/setSessionInviteCode.js

@@ -8,7 +8,7 @@ async function setSessionInviteCode(req, res) {
   // Assuming the access code is sent in the request body or as a query parameter
   const inviteCode = req.body.inviteCode || req.query.inviteCode;
   // console.log('hello invite code thing')
-  console.log('inviteCode',inviteCode)
+  // console.log('inviteCode',inviteCode)
   // // const cookies = parse(req.headers.cookie || '');
   // // console.log(cookies)
   // // const inviteCode = cookies['inviteCode']; // Retrieve the access code from parsed cookies
@@ -19,8 +19,8 @@ async function setSessionInviteCode(req, res) {
 
   // let inviteCode = cookies.get('inviteCode')
   // // console.log(	req.cookies.get('inviteCode')?.value  )
-console.log('session')
-console.log(req.session)
+// console.log('session')
+// console.log(req.session)
 // const inviteCode = false
   // console.log(inviteCode)
   try {