prod prepare

emilwidlund · Sep 28, 2024 · 1bf947a · 1bf947a
1 parent 41ded86
commit 1bf947a
Show file tree

Hide file tree

Showing 12 changed files with 38 additions and 131 deletions.
diff --git a/apps/web/prisma/schema.prisma b/apps/web/prisma/schema.prisma
@@ -116,7 +116,6 @@ enum NodeType {
   LERP
   CUBIC_BEZIER
   OSCILLATOR
-  IMAGE_EDIT_AI
   SYNTHESIZED_IMAGE
   VISION
   FROM_VECTOR

diff --git a/apps/web/src/app/(landing)/Hero.tsx b/apps/web/src/app/(landing)/Hero.tsx
@@ -6,82 +6,24 @@ import { ArrowForwardOutlined } from '@mui/icons-material';
 import { Button } from '@bitspace/ui/button';
 import { Input } from '@bitspace/ui/input';
 import { Spinner } from '@/components/Spinner/Spinner';
+import Link from 'next/link';
 
 const isEmail = (email: string) => {
     return /^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/.test(email);
 };
 
 export const Hero = () => {
-    const [email, setEmail] = useState('');
-    const [showInput, setShowInput] = useState(false);
-    const [loading, setLoading] = useState(false);
-    const [success, setSuccess] = useState(false);
-    const [error, setError] = useState<string | undefined>();
-
-    const handleSignUp = useCallback(async () => {
-        if (isEmail(email)) {
-            setLoading(true);
-            await createSubscription(email)
-                .then(() => setSuccess(true))
-                .catch(() => setError('An error occured. Please try again.'))
-                .finally(() => setLoading(false));
-        }
-    }, [setSuccess, setError, email]);
-
-    const handleKeyDown = useCallback(
-        async (e: React.KeyboardEvent<HTMLInputElement>) => {
-            e.stopPropagation();
-
-            if (e.key === 'Enter') {
-                handleSignUp();
-            }
-        },
-        [handleSignUp]
-    );
-
     return (
         <div className="flex flex-col items-center max-w-4xl w-full gap-y-16 text-center">
             <h1 className="text-5xl md:text-8xl md:text-balance leading-normal md:leading-tight tracking-tight">
                 Creative computing for everyone
             </h1>
-            <p className="text-gray-500 text-xl">
+            <p className="text-gray-500 text-2xl">
                 A space for exploration & creative imagination
             </p>
-            {showInput ? (
-                success || error ? (
-                    <span className="text-center">
-                        {error ? error : 'Thank you for joining the waitlist!'}
-                    </span>
-                ) : (
-                    <div className="flex flex-row relative gap-x-4">
-                        <Input
-                            className="shadow-2xl w-64 bg-white"
-                            placeholder="Email"
-                            autoFocus
-                            onKeyDown={handleKeyDown}
-                            onChange={e => setEmail(e.currentTarget.value)}
-                            value={email}
-                        />
-                        <Button
-                            className="h-12 w-12"
-                            onClick={handleSignUp}
-                            disabled={!isEmail(email) || loading}
-                        >
-                            {loading ? (
-                                <span className="flex flex-col justify-center items-center">
-                                    <Spinner className="h-4 w-4" />
-                                </span>
-                            ) : (
-                                <ArrowForwardOutlined fontSize="inherit" />
-                            )}
-                        </Button>
-                    </div>
-                )
-            ) : (
-                <Button onClick={() => setShowInput(true)}>
-                    Join the Waitlist
-                </Button>
-            )}
+            <Link href={`/login`}>
+                <Button>Open Prototype</Button>
+            </Link>
         </div>
     );
 };
diff --git a/apps/web/src/app/(landing)/createSubscription.ts b/apps/web/src/app/(landing)/createSubscription.ts
diff --git a/apps/web/src/app/(protected)/circuit/[...circuitId]/ClientPage.tsx b/apps/web/src/app/(protected)/circuit/[...circuitId]/ClientPage.tsx
@@ -46,6 +46,14 @@ export const ClientPage = ({ circuit }: { circuit: ExtendedNode }) => {
                         onNodeMoveStop={onNodeMoveStop}
                     />
                     {menuOpen && <Menu onClose={() => setMenuOpen(false)} />}
+                    <div className="absolute left-1/2 bottom-12 -translate-x-1/2 flex flex-row justify-center">
+                        {
+                            <MenuButton
+                                onClick={onMenuButtonClick}
+                                animate={menuOpen}
+                            />
+                        }
+                    </div>
                     <Onboarding />
                 </div>
                 <PropertyPanel />

diff --git a/apps/web/src/app/(protected)/circuit/[...circuitId]/Onboarding.tsx b/apps/web/src/app/(protected)/circuit/[...circuitId]/Onboarding.tsx
@@ -5,7 +5,7 @@ export const Onboarding = () => (
         persistenceKey="onboarding-complete"
         steps={[
             {
-                title: 'Welcome to Bitspace',
+                title: 'Welcome to the Bitspace prototype',
                 description: `A visual programming environment for creative endeavours. Let's go through the basics.`
             },
             {
@@ -21,7 +21,12 @@ export const Onboarding = () => (
             {
                 title: 'Connections',
                 description:
-                    'These are used to link data between different nodes. Connections may only be established between outputs & inputs'
+                    'The transport layer between nodes. Connections may only be established between outputs & inputs'
+            },
+            {
+                title: 'Add your first node',
+                description:
+                    'Access the Node menu by pressing spacebar & search for a node to add to the circuit.'
             }
         ]}
     />

diff --git a/apps/web/src/app/(protected)/dashboard/ClientPage.tsx b/apps/web/src/app/(protected)/dashboard/ClientPage.tsx
@@ -42,7 +42,7 @@ export default function Page({ circuits }: { circuits: Node[] }): JSX.Element {
                         }
                     }}
                 >
-                    Welcome to your Bitspace
+                    Dashboard
                 </motion.h1>
             </motion.div>
             <div className="flex flex-row gap-x-6">

diff --git a/apps/web/src/app/login/page.tsx b/apps/web/src/app/login/page.tsx
@@ -24,14 +24,20 @@ export default function Page() {
 
     return (
         <div className="flex flex-col justify-center items-center h-screen w-screen">
-            <div className="flex flex-col w-72 gap-y-12">
+            <div className="flex flex-col w-80 gap-y-12">
                 <div className="flex flex-col gap-y-2">
                     <h2 className="text-2xl font-medium">
                         Welcome to Bitspace
                     </h2>
-                    <p className="text-lg text-gray-500">
-                        A new era of creative computing for everyone
-                    </p>
+                    {isSent ? (
+                        <p className="text-lg text-gray-500">
+                            Check your email for a 6-digit code
+                        </p>
+                    ) : (
+                        <p className="text-lg text-gray-500">
+                            A new era of creative computing for everyone
+                        </p>
+                    )}
                 </div>
                 <div className="flex flex-col">
                     {isSent ? (
@@ -142,7 +148,7 @@ const VerifyOTPForm = ({ email }: VerifyOTPFormProps) => {
                             <InputOTPSlot
                                 key={index.toString()}
                                 {...slot}
-                                className="w-[62px] h-[62px] first:rounded-l-xl last:rounded-r-xl"
+                                className="w-[52px] h-[52px] first:rounded-l-xl last:rounded-r-xl"
                             />
                         ))}
                     </InputOTPGroup>

diff --git a/apps/web/src/circuit/containers/CircuitHeader/CircuitHeader.tsx b/apps/web/src/circuit/containers/CircuitHeader/CircuitHeader.tsx
@@ -24,7 +24,7 @@ export const CircuitHeader = ({ circuit }: { circuit: ExtendedNode }) => {
                 <h3 className="text-2xl">Bitspace</h3>
             </Link>
             <CircuitModule circuit={circuit} />
-            <Avatar />
+            {/** <Avatar /> */}
         </motion.div>
     );
 };
@@ -41,7 +41,7 @@ const CircuitModule = ({ circuit }: { circuit: ExtendedNode }) => {
         );
 
     return (
-        <div className="flex flex-row items-center gap-x-2 focus-within:bg-white focus-within:shadow-2xl hover:bg-white hover:shadow-2xl transition-all pr-3 pl-6 py-2 rounded-full">
+        <div className="flex flex-row items-center gap-x-2 focus-within:bg-white focus-within:shadow-2xl hover:bg-white hover:shadow-2xl transition-all pr-3 pl-6 py-2 rounded-full absolute left-1/2 -translate-x-1/2">
             <h3
                 className="bg-transparent border-none p-0 w-fit cursor-text focus-within:outline-none"
                 spellCheck="false"

diff --git a/packages/nodes/src/ai/ImageEdit/ImageEdit.tsx b/packages/nodes/src/ai/ImageEdit/ImageEdit.tsx
diff --git a/packages/nodes/src/ai/index.ts b/packages/nodes/src/ai/index.ts
@@ -1,19 +1,18 @@
 import { Prompt } from './Prompt/Prompt';
 import { SynthesizedImage } from './SynthesizedImage/SynthesizedImage';
 import { NodeType } from '../types';
-import { ImageEdit } from './ImageEdit/ImageEdit';
 import { Vision } from './Vision/Vision';
 
 // AI
-export const AINodes = [SynthesizedImage, ImageEdit, Prompt, Vision].sort(
-    (a, b) => a.displayName.localeCompare(b.displayName)
+export const AINodes = [SynthesizedImage, Prompt, Vision].sort((a, b) =>
+    a.displayName.localeCompare(b.displayName)
 );
 
-export type AINode = SynthesizedImage | ImageEdit | Prompt | Vision;
+export type AINode = SynthesizedImage | Prompt | Vision;
 
 export interface AINodeConstructor {
     new (): AINode;
     type: NodeType;
 }
 
-export { SynthesizedImage, ImageEdit, Prompt, Vision };
+export { SynthesizedImage, Prompt, Vision };
diff --git a/packages/nodes/src/descriptions.ts b/packages/nodes/src/descriptions.ts
@@ -60,8 +60,6 @@ export const NodeDescriptionsMap: Record<NodeType, string> = {
     [NodeType.WEBCAM]: 'Returns a webcam stream',
     [NodeType.GAMEPAD]: 'Returns states from a connected gamepad',
     [NodeType.SYNTHESIZED_IMAGE]: 'Returns an image based on the input prompt',
-    [NodeType.IMAGE_EDIT_AI]:
-        'Returns a new image based on the input image, a given instruction prompt & a mask with transparent area to replace',
     [NodeType.IMAGE_VARIATION_AI]:
         'Returns a new image based on the input image & a given instruction prompt',
     [NodeType.PROMPT_AI]: 'Returns text based on the input prompt',

diff --git a/packages/nodes/src/types.ts b/packages/nodes/src/types.ts
@@ -44,7 +44,6 @@ export enum NodeType {
     LERP = 'LERP',
     CUBIC_BEZIER = 'CUBIC_BEZIER',
     OSCILLATOR = 'OSCILLATOR',
-    IMAGE_EDIT_AI = 'IMAGE_EDIT_AI',
     SYNTHESIZED_IMAGE = 'SYNTHESIZED_IMAGE',
     VISION = 'VISION',
     FROM_VECTOR = 'FROM_VECTOR',