Feat improve b2b ux

client/package.json

@@ -54,7 +54,7 @@
     "react-copy-to-clipboard": "^5.1.0",
     "react-device-detect": "^2.2.3",
     "react-dom": "18.2.0",
-    "react-hook-form": "7.43.1",
+    "react-hook-form": "^7.43.1",
     "react-markdown": "^9.0.1",
     "react-number-format": "5.1.4",
     "react-router-dom": "6.8.1",

client/src/components/layout.tsx

@@ -63,7 +63,7 @@ export default function Layout({ children }: { children: ReactElement }) {
         disableGutters
         sx={{
           width: '100%',
-          height: !userScrolledDown && !isSmallScreen ? `calc(100% - ${headerHeight})` : '100%',
+          height: `calc(100% - ${headerHeight})`,
           top: userScrolledDown && isSmallScreen ? 0 : headerHeight,
           position: 'fixed',
           transition: 'all 0.2s',

client/src/components/logo.tsx

@@ -21,7 +21,7 @@ import { Icon } from '@mui/material';
 const Logo = () => {
   return (
     <Icon sx={{ height: '100%', width: '100%', display: 'flex' }}>
-      <img src={'./fair-ai-outline.svg'} alt='FairAI Logo' />
+      <img src={'./logo_non_capitalized_black_transp.svg'} alt='FairAI Logo' />
     </Icon>
   );
 };

client/src/components/make-request-banner.tsx

@@ -0,0 +1,55 @@
+import { StyledMuiButton } from '@/styles/components';
+import { useCallback } from 'react';
+import { useNavigate } from 'react-router';
+import InfoRounded from '@mui/icons-material/InfoRounded';
+import LibraryAddRoundedIcon from '@mui/icons-material/LibraryAddRounded';
+
+const MakeRequestBanner = ({ smallScreen }: { smallScreen: boolean }) => {
+  const navigate = useNavigate();
+  const openRequestsRoute = useCallback(() => navigate('/request'), [navigate]);
+
+  return (
+    <div className='flex justify-center w-full animate-slide-down'>
+      <div
+        style={{
+          opacity: 1,
+          height: 'fit-content',
+          minHeight: '40px',
+          width: 'fit-content',
+          maxWidth: '100%',
+          marginTop: !smallScreen ? '30px' : '20px',
+          padding: !smallScreen ? '20px' : '10px',
+          borderRadius: '20px',
+          background: 'linear-gradient(200deg, #bfe3e0, #a9c9d4)',
+          color: '#003030',
+          marginLeft: '20px',
+          marginRight: '20px',
+        }}
+        className='w-full flex flex-wrap justify-center xl:justify-between items-center gap-3 shadow-sm font-medium overflow-hidden text-xs md:text-base'
+      >
+        <span className='px-2 flex flex-nowrap gap-3 items-center'>
+          <InfoRounded className='mr-2' />
+          Are you looking for custom made, tailored solutions for your own projects?
+          <br />
+          Create your request listing, define your budget and quickly get amazing solutions tailored
+          for you by the trusted FairAI community members.
+        </span>
+
+        <StyledMuiButton
+          style={{
+            display: 'flex',
+            gap: '5px',
+            alignItems: 'center',
+          }}
+          className='plausible-event-name=HomeScreen-Info-Message-Access-Requests primary'
+          onClick={openRequestsRoute}
+        >
+          <LibraryAddRoundedIcon style={{ width: '20px', marginRight: '4px' }} />
+          Create a request
+        </StyledMuiButton>
+      </div>
+    </div>
+  );
+};
+
+export default MakeRequestBanner;

client/src/components/navbar.tsx

@@ -351,7 +351,7 @@ const Navbar = ({ userScrolledDown }: { userScrolledDown: boolean }) => {
 
                       <div className='w-full px-4'>
                         <img
-                          src='./fair-ai-outline.svg'
+                          src='./logo_non_capitalized_black_transp.svg'
                           alt='FairAI Logo'
                           style={{
                             width: '200px',

client/src/constants.ts

@@ -45,6 +45,9 @@ export const OLD_PROTOCOL_VERSION = '1.0';
 export const PROTOCOL_NAME = 'FairAI';
 export const PROTOCOL_VERSION = '2.0';
 
+export const PROTOCOL_NAME_TEST = 'FairAI-test';
+export const PROTOCOL_VERSION_TEST = 'test';
+
 export const MARKETPLACE_FEE = '0.5'; // u
 export const OPERATOR_REGISTRATION_AR_FEE = '0.05'; // u
 

client/src/context/throwaway.tsx

@@ -198,7 +198,12 @@ export const ThrowawayProvider = ({ children }: { children: ReactNode }) => {
           `https://arweave.net/${throwawayData.data.transactions.edges[0].node.id}`,
         );
         const encData = await result.text();
-        const decData = await decrypt(encData as `0x${string}`);
+        const buf = Buffer.from(
+          encData,
+          'utf8'
+        );
+        const encryptedValue = '0x' + buf.toString('hex');  
+        const decData = await decrypt(encryptedValue as `0x${string}`);
         setPrivateKey(decData);
         await setIrys(decData as `0x${string}`);
         setThrowawayProvider(decData as `0x${string}`);