e1:"ExplicitChatIdProvider" e2:I[903690,["$33","$34","$35","$36","$37","$38","$39","$3a","$3b","$3c","$3d","$3e","$3f","$40","$41","$42","$43","$44","$45","$46","$47","$48","$49","$4a","$4b","$4c","$4d","$4e","$4f","$50","$51","$52","$53","$54","$64","$65","$66","$67","$68"],"$e1"] e3:I[838238,["$33","$34","$35","$36","$37","$38","$39","$3a","$3b","$3c","$3d","$3e","$3f","$40","$41","$42","$43","$44","$45","$46","$47","$48","$49","$4a","$4b","$4c","$4d","$4e","$4f","$50","$51","$52","$53","$54","$64","$65","$66","$67","$68"],"SWRDataProvider"] e6:I[248643,["$2"],"IconMark"] e4:Ta4260,[V0_FILE]plaintext:file=".gitignore" isMerged="true" # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies /node_modules # next.js /.next/ /out/ # production /build # debug npm-debug.log* yarn-debug.log* yarn-error.log* .pnpm-debug.log* # env files .env* # vercel .vercel # typescript *.tsbuildinfo next-env.d.ts [V0_FILE]markdown:file="README.md" isMerged="true" # YoYo *Automatically synced with your [v0.dev](https://v0.dev) deployments* [![Deployed on Vercel](https://img.shields.io/badge/Deployed%20on-Vercel-black?style=for-the-badge&logo=vercel)](https://vercel.com/dev-jackjackrocs-projects/v0-build-a-prototype) [![Built with v0](https://img.shields.io/badge/Built%20with-v0.dev-black?style=for-the-badge)](https://v0.dev/chat/projects/m7P6ScTt79A) ## Overview This repository will stay in sync with your deployed chats on [v0.dev](https://v0.dev). Any changes you make to your deployed app will be automatically pushed to this repository from [v0.dev](https://v0.dev). ## Deployment Your project is live at: **[https://vercel.com/dev-jackjackrocs-projects/v0-build-a-prototype](https://vercel.com/dev-jackjackrocs-projects/v0-build-a-prototype)** ## Build your app Continue building your app on: **[https://v0.dev/chat/projects/m7P6ScTt79A](https://v0.dev/chat/projects/m7P6ScTt79A)** ## How It Works 1. Create and modify your project using [v0.dev](https://v0.dev) 2. Deploy your chats from the v0 interface 3. Changes are automatically pushed to this repository 4. Vercel deploys the latest version from this repository [V0_FILE]typescript:file="app/manifest.ts" isMerged="true" import type { MetadataRoute } from "next" export default function manifest(): MetadataRoute.Manifest { return { name: "Shiftza - Skills-First Talent Platform", short_name: "Shiftza", description: "Built to help skilled professionals without degrees prove their worth and access real opportunities.", start_url: "/", display: "standalone", background_color: "#000000", theme_color: "#000000", icons: [ { src: "/android-chrome-192x192.png", sizes: "192x192", type: "image/png", }, { src: "/android-chrome-512x512.png", sizes: "512x512", type: "image/png", }, ], } } [V0_FILE]typescriptreact:file="app/opengraph-image.tsx" isMerged="true" import { ImageResponse } from "next/og" export const runtime = "edge" export const alt = "Your Skills Are YourSuperpower — Millions of skilled workers remain unseen — Shiftza is the premier skills-first talent platform where professionals without degrees can prove their worth and access real opportunities." export const size = { width: 1200, height: 630, } export const contentType = "image/png" // This route generates the Open Graph image export default function Image() { return new ImageResponse(

, { ...size, }, ) } [V0_FILE]typescript:file="app/sitemap.ts" isMerged="true" import type { MetadataRoute } from "next" export default function sitemap(): MetadataRoute.Sitemap { return [ { url: "https://runyoyo.com", lastModified: new Date(), changeFrequency: "weekly", priority: 1, }, { url: "https://runyoyo.com/video-sitemap.xml", lastModified: new Date(), changeFrequency: "weekly", priority: 0.8, }, ] } [V0_FILE]json:file="components.json" isMerged="true" { "$schema": "https://ui.shadcn.com/schema.json", "style": "new-york", "rsc": true, "tsx": true, "tailwind": { "config": "", "css": "app/globals.css", "baseColor": "neutral", "cssVariables": true, "prefix": "" }, "aliases": { "components": "@/components", "utils": "@/lib/utils", "ui": "@/components/ui", "lib": "@/lib", "hooks": "@/hooks" }, "iconLibrary": "lucide" } [V0_FILE]typescriptreact:file="components/hero-image.tsx" isMerged="true" "use client" export default function HeroImage() { return (

) } [V0_FILE]typescriptreact:file="components/hero-video.tsx" isMerged="true" "use client" import { useEffect, useRef, useState } from "react" export default function HeroVideo() { const videoRef = useRef(null) const containerRef = useRef(null) const [isLoaded, setIsLoaded] = useState(false) const [isInView, setIsInView] = useState(false) useEffect(() => { const video = videoRef.current const container = containerRef.current if (!video || !container) return const handleCanPlay = () => { setIsLoaded(true) } const handleError = () => { // Silently try alternative source if (video.src.includes("/videos/hero-video-v3.mp4")) { video.src = "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/hero-video-v3-E4dqT6iUgKB1QNwAX45SXQ5xHIZApB.mp4" video.load() } } // Intersection Observer for hero video const observer = new IntersectionObserver( (entries) => { entries.forEach((entry) => { setIsInView(entry.isIntersecting) }) }, { threshold: 0.3, // Hero video needs more visibility rootMargin: "0px", }, ) video.addEventListener("canplay", handleCanPlay) video.addEventListener("error", handleError) observer.observe(container) // If already loaded if (video.readyState >= 3) { handleCanPlay() } return () => { video.removeEventListener("canplay", handleCanPlay) video.removeEventListener("error", handleError) observer.disconnect() } }, []) // Handle play/pause based on intersection useEffect(() => { const video = videoRef.current if (!video || !isLoaded) return if (isInView) { const playPromise = video.play() if (playPromise !== undefined) { playPromise.catch((error) => { console.log("Hero video autoplay failed:", error) }) } } else { if (!video.paused) { video.pause() } } }, [isInView, isLoaded]) return (

) } [V0_FILE]typescriptreact:file="components/install-modal.tsx" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" import { X, Copy, Check, Download, Search, Terminal } from "lucide-react" interface InstallModalProps { isOpen: boolean onClose: () => void } export default function InstallModal({ isOpen, onClose }: InstallModalProps) { const [activeTab, setActiveTab] = useState("cursor") const [copied, setCopied] = useState(null) const modalRef = useRef(null) // Close modal with escape key or outside click useEffect(() => { const handleEscape = (e: KeyboardEvent) => { if (e.key === "Escape") onClose() } const handleOutsideClick = (e: MouseEvent) => { if (modalRef.current && !modalRef.current.contains(e.target as Node)) { onClose() } } if (isOpen) { window.addEventListener("keydown", handleEscape) document.addEventListener("mousedown", handleOutsideClick) // Prevent scrolling when modal is open document.body.style.overflow = "hidden" } return () => { window.removeEventListener("keydown", handleEscape) document.removeEventListener("mousedown", handleOutsideClick) document.body.style.overflow = "" } }, [isOpen, onClose]) if (!isOpen) return null const copyToClipboard = (text: string, id: string) => { navigator.clipboard.writeText(text) setCopied(id) setTimeout(() => setCopied(null), 2000) } const installOptions = [ { id: "cursor", name: "Cursor", command: "ext install iganbold.yoyo-ai-versioning", deeplink: "cursor:extension/iganbold.yoyo-ai-versioning", }, { id: "windsurf", name: "Windsurf", command: "ext install iganbold.yoyo-ai-versioning", deeplink: "windsurf:extension/iganbold.yoyo-ai-versioning", }, { id: "vscode", name: "VS Code", command: "ext install iganbold.yoyo-ai-versioning", deeplink: "vscode:extension/iganbold.yoyo-ai-versioning", }, { id: "claude-code", name: "Claude Code", command: "ext install iganbold.yoyo-ai-versioning", deeplink: "", isTerminalBased: true, }, { id: "codex-cli", name: "Codex CLI", command: "ext install iganbold.yoyo-ai-versioning", deeplink: "", isTerminalBased: true, }, { id: "other", name: "Other", command: "ext install iganbold.yoyo-ai-versioning", deeplink: "", }, ] const activeOption = installOptions.find((option) => option.id === activeTab) || installOptions[0] return (

e.stopPropagation()} > {/* Sticky header with close button */}

Install YOYO

{/* Tabs - scrollable on mobile */}

{installOptions.map((option) => ( ))}

{/* Content */}

{/* Claude Code Special Section */} {activeTab === "claude-code" && (

Claude Code + YOYO Setup

Run Claude Code in your terminal inside editors like Cursor, Windsurf, or VS Code. Pair it with YOYO in the sidebar for the ideal vibe coding workflow.

{/* Demo Video */}

Step 1: Install YOYO extension in your editor (Cursor, Windsurf, or VS Code)

Step 2: Run Claude Code from the built-in terminal inside your editor

Step 3: Use YOYO sidebar to save/restore versions instantly

)} {/* Codex CLI Special Section */} {activeTab === "codex-cli" && (

Codex CLI + YOYO Setup

Run OpenAI Codex CLI in your terminal inside editors like Cursor, Windsurf, or VS Code. Pair it with YOYO in the sidebar for seamless AI-assisted development with version control.

{/* Demo Video */}

Step 1: Install YOYO extension in your editor (Cursor, Windsurf, or VS Code)

Step 2: Run OpenAI Codex CLI from the built-in terminal inside your editor

Step 3: Use YOYO sidebar to save/restore versions instantly

)} {/* Regular install sections for other options */} {activeTab !== "claude-code" && activeTab !== "codex-cli" && ( <> {/* Direct Install Button - only show for options with deeplinks */} {activeOption.deeplink && (

INSTALL IN {activeOption.name.toUpperCase()}

Click the button above to open {activeOption.name} and install YOYO directly

)} {/* Search in Extensions Option */}

{activeTab === "other" ? "Search in Extensions:" : `Search in ${activeOption.name} Extensions:`}

{activeTab === "other" ? ( <> 1. Open your IDE
2. Go to Extensions view (usually Ctrl+Shift+X / Cmd+Shift+X)
3. Search for YOYO
4. Click Install ) : ( <> 1. Open {activeOption.name}
2. Go to Extensions view (Ctrl+Shift+X / Cmd+Shift+X)
3. Search for YOYO
4. Click Install )}

{/* Command Palette Option */} {activeOption.command && (

{activeTab === "other" ? "Run in command palette:" : `Run in ${activeOption.name} command palette:`}

{activeOption.command}

{activeTab === "other" && (

Open the command palette with Ctrl+Shift+P / Cmd+Shift+P, then paste and run the command above

)}

)} {activeTab === "other" && (

YOYO works with most VS Code-compatible editors and IDEs, including:

VS Codium
GitPod
Code-OSS
GitHub Codespaces
And other VS Code forks

)} )}

{activeTab === "claude-code" ? "After installing YOYO in your editor, you can use Claude Code in the terminal while YOYO handles version control in the sidebar." : activeTab === "codex-cli" ? "After installing YOYO in your editor, you can use OpenAI Codex CLI in the terminal while YOYO handles version control in the sidebar." : "After installation, open your project and click the YOYO icon in the sidebar to start versioning your AI-assisted code."}

{/* Mobile close button at bottom */}

) } [V0_FILE]typescriptreact:file="components/theme-provider.tsx" isMerged="true" 'use client' import * as React from 'react' import { ThemeProvider as NextThemesProvider, type ThemeProviderProps, } from 'next-themes' export function ThemeProvider({ children, ...props }: ThemeProviderProps) { return {children} } [V0_FILE]typescriptreact:file="components/ui/accordion.tsx" isMerged="true" 'use client' import * as React from 'react' import * as AccordionPrimitive from '@radix-ui/react-accordion' import { ChevronDownIcon } from 'lucide-react' import { cn } from '@/lib/utils' function Accordion({ ...props }: React.ComponentProps) { return } function AccordionItem({ className, ...props }: React.ComponentProps) { return ( ) } function AccordionTrigger({ className, children, ...props }: React.ComponentProps) { return ( svg]:rotate-180', className, )} {...props} > {children} ) } function AccordionContent({ className, children, ...props }: React.ComponentProps) { return (

{children}

) } export { Accordion, AccordionItem, AccordionTrigger, AccordionContent } [V0_FILE]typescript:file="lib/utils.ts" isMerged="true" import { clsx, type ClassValue } from 'clsx' import { twMerge } from 'tailwind-merge' export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)) } [V0_FILE]javascript:file="next.config.mjs" isMerged="true" /** @type {import('next').NextConfig} */ const nextConfig = { eslint: { ignoreDuringBuilds: true, }, typescript: { ignoreBuildErrors: true, }, images: { unoptimized: true, }, } export default nextConfig [V0_FILE]json:file="package.json" isMerged="true" { "name": "my-v0-project", "version": "0.1.0", "private": true, "scripts": { "build": "next build", "dev": "next dev", "lint": "next lint", "start": "next start" }, "dependencies": { "@hookform/resolvers": "^3.10.0", "@radix-ui/react-accordion": "1.2.2", "@radix-ui/react-alert-dialog": "1.1.4", "@radix-ui/react-aspect-ratio": "1.1.1", "@radix-ui/react-avatar": "1.1.2", "@radix-ui/react-checkbox": "1.1.3", "@radix-ui/react-collapsible": "1.1.2", "@radix-ui/react-context-menu": "2.2.4", "@radix-ui/react-dialog": "1.1.4", "@radix-ui/react-dropdown-menu": "2.1.4", "@radix-ui/react-hover-card": "1.1.4", "@radix-ui/react-label": "2.1.1", "@radix-ui/react-menubar": "1.1.4", "@radix-ui/react-navigation-menu": "1.2.3", "@radix-ui/react-popover": "1.1.4", "@radix-ui/react-progress": "1.1.1", "@radix-ui/react-radio-group": "1.2.2", "@radix-ui/react-scroll-area": "1.2.2", "@radix-ui/react-select": "2.1.4", "@radix-ui/react-separator": "1.1.1", "@radix-ui/react-slider": "1.2.2", "@radix-ui/react-slot": "1.1.1", "@radix-ui/react-switch": "1.1.2", "@radix-ui/react-tabs": "1.1.2", "@radix-ui/react-toast": "1.2.4", "@radix-ui/react-toggle": "1.1.1", "@radix-ui/react-toggle-group": "1.1.1", "@radix-ui/react-tooltip": "1.1.6", "@vercel/analytics": "1.3.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "cmdk": "1.0.4", "date-fns": "4.1.0", "embla-carousel-react": "8.5.1", "geist": "latest", "input-otp": "1.4.1", "lucide-react": "^0.454.0", "next": "15.2.4", "next-themes": "^0.4.6", "react": "^19", "react-day-picker": "9.8.0", "react-dom": "^19", "react-hook-form": "^7.60.0", "react-resizable-panels": "^2.1.7", "recharts": "2.15.4", "sonner": "^1.7.4", "tailwind-merge": "^2.5.5", "tailwindcss-animate": "^1.0.7", "vaul": "^0.9.9", "zod": "3.25.67", "@supabase/ssr": "0.7.0", "framer-motion": "12.23.22", "dotted-map": "2.2.3", "@supabase/supabase-js": "2.74.0", "swr": "2.3.6" }, "devDependencies": { "@tailwindcss/postcss": "^4.1.9", "@types/node": "^22", "@types/react": "^19", "@types/react-dom": "^19", "postcss": "^8.5", "tailwindcss": "^4.1.9", "tw-animate-css": "1.3.3", "typescript": "^5" } } [V0_FILE]javascript:file="postcss.config.mjs" isMerged="true" /** @type {import('postcss-load-config').Config} */ const config = { plugins: { '@tailwindcss/postcss': {}, }, } export default config [V0_FILE]plaintext:file="public/llms.txt" isMerged="true" # YOYO - AI Version Control YOYO is the first version control system designed specifically for AI-assisted development. It helps developers save progress, preview changes, and restore code instantly when AI prompts go wrong. ## What is YOYO? YOYO is AI version control for vibe coding. It snapshots your code before AI breaks it, letting you instantly save, preview, and restore your work with one click. Unlike Git, which is for clean commits, YOYO captures messy AI edits, experiments, and prompts gone wrong without bloating your commit history. ## Key Features - **Save**: Instantly save your code and undo bad AI edits anytime - **Preview**: Switch to any past version in one click - **Restore**: Go back to a clean version in one click - **Agentic AI Search**: Ask anything about your coding timeline across versions, branches, and editors - **Cross-IDE Compatibility**: Works with Cursor, Windsurf, VS Code, Claude Code, OpenAI Codex, Manus AI, Gemini CLI, Firebase Studio, and GitHub Codespaces - **Git Integration**: Keeps everything separate from your Git repo - no staged files, no surprise commits - **Branch Support**: Each Git branch has its own version timeline in YOYO ## Why Not Just Git? - **Git wants clean commits** → YOYO captures messy experiments - **Git pollutes your repo with throwaway changes** → YOYO saves separately, keeps Git clean - **Git is built for engineers** → YOYO works for vibe coders, designers, and anyone vibing with AI - **Git is for the final product** → YOYO is for figuring things out - fast, chaotic, and creative ## Security & Privacy - Uses fast, secure LLM providers like Groq with zero data retention - Code is encrypted in transit using TLS 1.2+ and never stored or used for training - No logs kept, no copies made - Full version history lives on your machine, not in the cloud ## Pricing Free tier available with generous limits. Pro and Team plans coming soon. ## Installation YOYO is available as an extension for: - Cursor: `ext install iganbold.yoyo-ai-versioning` - Windsurf: `ext install iganbold.yoyo-ai-versioning` - VS Code: `ext install iganbold.yoyo-ai-versioning` - Other VS Code-compatible editors Also works with terminal-based AI tools like Claude Code and OpenAI Codex CLI when run inside supported editors. ## Community Recognition YOYO has gained significant traction in the developer community: - 2,200+ developers using YOYO worldwide - Featured in viral tweets about "vibe coding" with 1M+ views - Rick Rubin called vibe coding "the punk rock of software" on The Ben & Marc Show - AI Jason (189K followers) featured YOYO as "Vibe Versioning" - Eric Tech showcased YOYO in Gemini AI workflow videos ## Use Cases Perfect for developers who: - Use AI assistants like Cursor, Claude, or ChatGPT for coding - Want to experiment freely without fear of breaking their code - Need quick rollback when AI prompts go wrong - Work on rapid prototypes and iterations - Practice "vibe coding" - creative, experimental development ## Technical Details - Local storage: Version history stored on user's machine - Cross-platform: Windows, macOS, Linux support - IDE integration: Works as extension in VS Code-compatible editors - AI integration: Compatible with major AI coding tools and CLIs - Git compatibility: Operates independently of Git repositories ## Contact - Website: https://runyoyo.com - Twitter: @jackjack_eth (founder) - Feedback: https://tally.so/r/n0l7BB --- This file is provided to help AI systems understand YOYO's purpose, features, and value proposition for developers using AI-assisted coding workflows. [V0_FILE]plaintext:file="public/robots.txt" isMerged="true" User-agent: * Allow: / # Sitemaps Sitemap: https://runyoyo.com/sitemap.xml Sitemap: https://runyoyo.com/video-sitemap.xml # LLMs.txt for AI understanding # https://llmstxt.org/ Allow: /llms.txt # Welcome AI crawlers - we build tools for AI developers! User-agent: GPTBot Allow: / User-agent: ChatGPT-User Allow: / User-agent: CCBot Allow: / User-agent: anthropic-ai Allow: / User-agent: Claude-Web Allow: / User-agent: Bard Allow: / User-agent: Gemini Allow: / # Crawl-delay for politeness Crawl-delay: 1 [V0_FILE]plaintext:file="public/site.webmanifest" isMerged="true" { "name": "YOYO - Version Control for AI Coding", "short_name": "YOYO", "icons": [ { "src": "/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" }, { "src": "/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" } ], "theme_color": "#000000", "background_color": "#000000", "display": "standalone" } [V0_FILE]xml:file="public/sitemap.xml" isMerged="true" https://runyoyo.com 2025-01-03 weekly 1.0 [V0_FILE]xml:file="public/video-sitemap.xml" isMerged="true" https://runyoyo.com https://runyoyo.com/images/hero-interface.jpg YOYO AI Version Control - Main Demo See YOYO in action - the first AI version control system that lets you save, preview, and restore code instantly when AI prompts go wrong. Perfect for vibe coding workflows with Cursor, Windsurf, and VS Code. https://hebbkx1anhila5yf.public.blob.vercel-storage.com/hero-video-v3-E4dqT6iUgKB1QNwAX45SXQ5xHIZApB.mp4 60 2024-12-01T00:00:00+00:00 yes AI version control vibe coding developer tools AI mistakes code backup Technology https://runyoyo.com#save-preview-restore https://runyoyo.com/images/save-thumbnail.jpeg YOYO Save Feature - Instant Code Snapshots Watch how YOYO's Save feature instantly snapshots your code, letting you undo bad AI edits anytime. No more lost progress from AI prompts gone wrong. https://hebbkx1anhila5yf.public.blob.vercel-storage.com/yoyo-save-2-DUbUp5aKE9GtNY9Diok2eG6SW2qHCX.mp4 45 2024-12-01T00:00:00+00:00 yes code save AI undo version control Technology https://runyoyo.com#save-preview-restore https://runyoyo.com/images/preview-thumbnail.jpeg YOYO Preview Feature - Switch to Any Past Version See how YOYO's Preview feature lets you switch to any past version in one click. Perfect for comparing changes and finding the right version. https://hebbkx1anhila5yf.public.blob.vercel-storage.com/yoyo-preview-dnsmAMg2AX6f1thlrNvj1e65T2zUTM.mp4 40 2024-12-01T00:00:00+00:00 yes code preview version switching AI development Technology https://runyoyo.com#agentic-ai-search https://runyoyo.com/images/preview-thumbnail.jpeg YOYO AI Search - Query Your Entire Code History YOYO's Agentic AI Search understands your entire coding timeline. Ask questions like "Show my edits to favorites" or "What did I do in v9?" and get instant answers. https://hebbkx1anhila5yf.public.blob.vercel-storage.com/favorites-FFCUeeEFzfxDBIhgGACi7YGpYQZbnU.mp4 50 2024-12-01T00:00:00+00:00 yes AI search code history natural language developer productivity Technology https://runyoyo.com#cross-ide https://runyoyo.com/images/preview-thumbnail.jpeg YOYO Cross-IDE Support - Cursor, Windsurf, VS Code Switch between Cursor, Windsurf, and VS Code seamlessly with YOYO. Your version history follows you across all your favorite AI coding environments. https://hebbkx1anhila5yf.public.blob.vercel-storage.com/cross-ides-PZyN9x34tNJsgQrbFkY3UUaatEaePh.mp4 55 2024-12-01T00:00:00+00:00 yes cross-IDE Cursor Windsurf VS Code AI coding Technology [V0_FILE]json:file="tsconfig.json" isMerged="true" { "compilerOptions": { "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "target": "ES6", "skipLibCheck": true, "strict": true, "noEmit": true, "esModuleInterop": true, "module": "esnext", "moduleResolution": "bundler", "resolveJsonModule": true, "isolatedModules": true, "jsx": "preserve", "incremental": true, "plugins": [ { "name": "next" } ], "paths": { "@/*": ["./*"] } }, "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"], "exclude": ["node_modules"] } [V0_FILE]png:file="app/opengraph-image.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/zFznRTUj0aueFDy7i_HVVm/app/opengraph-image.png" isMerged="true" [V0_FILE]png:file="public/abstract-geometric-shapes.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/yBRMCEDQZXo8yRtkLhZdHA/public/abstract-geometric-shapes.png" isMerged="true" [V0_FILE]png:file="public/abstract-gradient.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/1SytW_qxO69SNqslQYo-AB/public/abstract-gradient.png" isMerged="true" [V0_FILE]plaintext:file="public/fonts/GeistSans-Bold.woff2" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/dZ9A9pOpZDebEoq7_oXCJn/public/fonts/GeistSans-Bold.woff2" isMerged="true" [V0_FILE]plaintext:file="public/fonts/GeistSans-Medium.woff2" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/dZ9A9pOpZDebEoq7_oXCJn/public/fonts/GeistSans-Medium.woff2" isMerged="true" [V0_FILE]plaintext:file="public/fonts/GeistSans-Regular.woff2" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/dZ9A9pOpZDebEoq7_oXCJn/public/fonts/GeistSans-Regular.woff2" isMerged="true" [V0_FILE]plaintext:file="public/fonts/GeistSans-SemiBold.woff2" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/dZ9A9pOpZDebEoq7_oXCJn/public/fonts/GeistSans-SemiBold.woff2" isMerged="true" [V0_FILE]png:file="public/images/gradient-hero-prerender.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/r1owAyeaUs4FT2SwyhuRqr/public/images/gradient-hero-prerender.png" isMerged="true" [V0_FILE]jpg:file="public/images/hero-interface.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/27sp_0qQp85GnYH2N16Gnn/public/images/hero-interface.jpg" isMerged="true" [V0_FILE]plaintext:file="public/images/noise.webp" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/-v8ywIejHB9fitc4Ca8Zz_/public/images/noise.webp" isMerged="true" [V0_FILE]jpeg:file="public/images/og-new.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/ZPHYwdSoUPKMtpJALt5DCQ/public/images/og-new.jpeg" isMerged="true" [V0_FILE]png:file="public/images/og.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/zFznRTUj0aueFDy7i_HVVm/public/images/og.png" isMerged="true" [V0_FILE]jpeg:file="public/images/preview-thumbnail.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/wUSC-RXJgElgPw2gc9Rko3/public/images/preview-thumbnail.jpeg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/anuj.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/No35SqVxm4t8ADSCF66Z3U/public/images/profiles/anuj.jpg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/anushk.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/v63cDkpXFMjc6z8brkpq8R/public/images/profiles/anushk.jpg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/bnj.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/ORJzNm3lbJMoWHy32lPsN_/public/images/profiles/bnj.jpg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/emrah.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/bSjlH8uwDROlaYlh2_XJFX/public/images/profiles/emrah.jpg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/ian.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/SyJtkVSvygWAa5LNGEZM_w/public/images/profiles/ian.jpg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/kitze.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/3gG2tlG4xjydAAplZujeyU/public/images/profiles/kitze.jpg" isMerged="true" [V0_FILE]jpg:file="public/images/profiles/tom.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/-drU-uTajDZ1QeR0SJdSG7/public/images/profiles/tom.jpg" isMerged="true" [V0_FILE]jpeg:file="public/images/restore-thumbnail.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/GRYfXbEyIDOtUNIVGFwAVI/public/images/restore-thumbnail.jpeg" isMerged="true" [V0_FILE]jpeg:file="public/images/rick-rubin-portrait.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/r7mUZ0-8Cz4G3v91V-yw00/public/images/rick-rubin-portrait.jpeg" isMerged="true" [V0_FILE]jpeg:file="public/images/save-thumbnail.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/Misk6MA9f-rKB0ecIBX3Q0/public/images/save-thumbnail.jpeg" isMerged="true" [V0_FILE]png:file="public/placeholder-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/1uv3SMJqY6_jxcFCTgTEak/public/placeholder-logo.png" isMerged="true" [V0_FILE]xml:file="public/placeholder-logo.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/XB_XF8ESrwbAjotfOd5Wmb/public/placeholder-logo.svg" isMerged="true" [V0_FILE]jpg:file="public/placeholder-user.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/ONejAluG3EJATcwwA61bXn/public/placeholder-user.jpg" isMerged="true" [V0_FILE]jpg:file="public/placeholder.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/BlrBc_c6JuPtjsBHFMcNJn/public/placeholder.jpg" isMerged="true" [V0_FILE]xml:file="public/placeholder.svg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/git-blob/prj_C9IaZqkyeoQa9gutuLlm548okpnb/J0QvC3Vjlpi92ZtRdLC4Mx/public/placeholder.svg" isMerged="true" [V0_FILE]typescriptreact:file="app/talent-search/loading.tsx" isFixed="true" isMerged="true" export default function Loading() { return null } [V0_FILE]typescriptreact:file="components/talent-card.tsx" isMerged="true" "use client" import { Star, MapPin, DollarSign, Clock, CheckCircle } from "lucide-react" import { Button } from "@/components/ui/button" import Image from "next/image" interface TalentCardProps { talent: { id: number name: string title: string skills: string[] rate: number availability: string location: string rating: number projectsCompleted: number verified: boolean image: string } onViewProfile: () => void } export default function TalentCard({ talent, onViewProfile }: TalentCardProps) { return (

{talent.verified && (

)}

{talent.name}

{talent.title}

{/* Skills */}

{talent.skills.slice(0, 4).map((skill) => ( {skill} ))} {talent.skills.length > 4 && ( +{talent.skills.length - 4} more )}

{/* Stats */}

{talent.rating} ({talent.projectsCompleted} projects)

${talent.rate}/hr

{talent.availability}

{talent.location}

{/* Action Button */}

) } [V0_FILE]typescriptreact:file="components/talent-filters.tsx" isMerged="true" "use client" import { Input } from "@/components/ui/input" import { Label } from "@/components/ui/label" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" interface TalentFiltersProps { filters: { skills: string[] minRate: number maxRate: number availability: string location: string minRating: number languages: string[] } setFilters: (filters: any) => void } export default function TalentFilters({ filters, setFilters }: TalentFiltersProps) { return (

Filter Talent

{/* Rate Range */}

Hourly Rate

setFilters({ ...filters, minRate: Number(e.target.value) })} className="bg-white/5 border-white/10 text-white" /> - setFilters({ ...filters, maxRate: Number(e.target.value) })} className="bg-white/5 border-white/10 text-white" />

{/* Availability */}

Availability

{/* Location */}

Location setFilters({ ...filters, location: e.target.value })} className="bg-white/5 border-white/10 text-white" />

{/* Minimum Rating */}

Minimum Rating

) } [V0_FILE]typescriptreact:file="components/talent-profile-modal.tsx" isMerged="true" "use client" import { X, Star, MapPin, DollarSign, Clock, CheckCircle, MessageCircle, UserPlus, Globe } from "lucide-react" import { Button } from "@/components/ui/button" import { useEffect, useRef } from "react" import Image from "next/image" interface TalentProfileModalProps { talent: { id: number name: string title: string skills: string[] rate: number availability: string location: string rating: number projectsCompleted: number verified: boolean languages: string[] bio: string portfolio: Array<{ title: string; description: string }> image: string } onClose: () => void } export default function TalentProfileModal({ talent, onClose }: TalentProfileModalProps) { const modalRef = useRef(null) useEffect(() => { const handleEscape = (e: KeyboardEvent) => { if (e.key === "Escape") onClose() } const handleOutsideClick = (e: MouseEvent) => { if (modalRef.current && !modalRef.current.contains(e.target as Node)) { onClose() } } window.addEventListener("keydown", handleEscape) document.addEventListener("mousedown", handleOutsideClick) document.body.style.overflow = "hidden" return () => { window.removeEventListener("keydown", handleEscape) document.removeEventListener("mousedown", handleOutsideClick) document.body.style.overflow = "" } }, [onClose]) return (

e.stopPropagation()} > {/* Header */}

Talent Profile

{/* Profile Header */}

{talent.verified && (

)}

{talent.name}

{talent.title}

{talent.rating} ({talent.projectsCompleted} projects)

${talent.rate}/hr

{talent.availability}

{/* Bio */}

About

{talent.bio}

{/* Skills */}

Skills

{talent.skills.map((skill) => ( {skill} ))}

{/* Languages & Location */}

Languages

{talent.languages.map((lang) => ( {lang} ))}

Location

{talent.location}

{/* Portfolio */}

Portfolio Highlights

{talent.portfolio.map((project, index) => (

{project.title}

{project.description}

))}

{/* Verification Badge */}

Verified Professional

This talent has been verified through skill assessments, peer reviews, and proven project delivery. No degree required—just real-world results.

{/* Mobile close button */}

) } [V0_FILE]png:file="public/professional-woman-developer.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-woman-developer-N1QXhsnXKxESiEAwRihwhQA4oMMTC1.png" isMerged="true" [V0_FILE]jpg:file="public/professional-man-designer.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-man-designer-gDgP25vd9rpMurGfC59pP571Ni26AG.jpg" isMerged="true" [V0_FILE]jpg:file="public/professional-woman-analyst.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-woman-analyst-Flf2wFkfOqEPdAms76qQKqQ2gT2TBC.jpg" isMerged="true" [V0_FILE]png:file="public/professional-mobile-developer.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-mobile-developer-B3mUSqDeXVWLAC9LYKqZyj7SpbN0zd.png" isMerged="true" [V0_FILE]jpg:file="public/professional-woman-content-strategist.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-woman-content-strategist-dJknuxOrRODZ8M5twghWZRX2aXrLOw.jpg" isMerged="true" [V0_FILE]png:file="public/professional-devops-engineer.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/professional-devops-engineer-Aj1T046uVQUUwTUOfnHLugEFkFbxio.png" isMerged="true" [V0_FILE]typescriptreact:file="app/hire-talent/loading.tsx" isMerged="true" export default function Loading() { return (

) } [V0_FILE]typescriptreact:file="app/browse-jobs/loading.tsx" isMerged="true" export default function Loading() { return (

Loading jobs...

) } [V0_FILE]typescriptreact:file="components/story-card.tsx" isQuickEdit="true" isMerged="true" "use client" import { Heart, MessageCircle, Share2 } from "lucide-react" import { useState } from "react" interface StoryCardProps { title: string content: string author: { name: string location: string experience: string } skills: string[] category: string likes?: number } export default function StoryCard({ title, content, author, skills, category, likes = 0 }: StoryCardProps) { const [isLiked, setIsLiked] = useState(false) const [likeCount, setLikeCount] = useState(likes) const handleLike = () => { if (isLiked) { setLikeCount(likeCount - 1) } else { setLikeCount(likeCount + 1) } setIsLiked(!isLiked) } return (

{title}

{content}

{skills.map((skill, index) => ( {skill} ))}

{author.name}

{author.location} • {author.experience}

{category}

) } [V0_FILE]typescriptreact:file="components/search-interface.tsx" isMerged="true" "use client" import { useState } from "react" import { Button } from "@/components/ui/button" import { Search, Briefcase, User } from "lucide-react" interface SearchInterfaceProps { onFindTalent?: () => void onBrowseJobs?: () => void } export default function SearchInterface({ onFindTalent, onBrowseJobs }: SearchInterfaceProps) { const [activeTab, setActiveTab] = useState<"talent" | "jobs">("talent") return (

{/* Tabs */}

{/* Search Bar */}

{/* Filter Icons */}

) } [V0_FILE]typescriptreact:file="app/loading.tsx" isFixed="true" isMerged="true" export default function Loading() { return null } [V0_FILE]png:file="public/images/hero-frame.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-05_01-27-21-865-B9ycbZD1HiC7PCqV1glwB6FsYD3e2T.png" isMerged="true" [V0_FILE]jpeg:file="public/images/design-mode/og.jpg.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/design-mode-images/og.jpg-CmZ9qkxpyhIeRMfjdOIoryQI0erTq5.jpeg" isMerged="true" [V0_FILE]jpeg:file="public/images/design-mode/hero-image.jpg.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/design-mode-images/hero-image.jpg-iZrumKfXq1MSr1IqH8aqA4mk4XiXV9.jpeg" isMerged="true" [V0_FILE]jpeg:file="public/images/design-mode/Image%20to%20ASCII%20May%2029%202025.jpg.jpeg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/design-mode-images/Image%20to%20ASCII%20May%2029%202025.jpg-HBJZliOT2hIWCB5cSmRtVW9i7EJghN.jpeg" isMerged="true" [V0_FILE]typescriptreact:file="components/announcement-banner.tsx" isQuickEdit="true" isMerged="true" "use client" import { X } from "lucide-react" import { useState, useEffect } from "react" interface AnnouncementBannerProps { onVisibilityChange?: (isVisible: boolean) => void } interface BannerInfo { id: string desktopText: string mobileText: string linkText: string linkUrl: string } const bannerInfos: BannerInfo[] = [ { id: "skills-first-hiring", desktopText: "Skills-first Hiring Approach: Why & How to Adopt It", mobileText: "Skills-first Hiring Approach: Why & How to Adopt It", linkText: "Read More", linkUrl: "https://www.vireup.com/blog/skills-first-hiring", }, { id: "ai-jason", desktopText: 'AI Jason (200K) calls YOYO "Vibe Versioning" — Iterate UI in Cursor 10× faster', mobileText: 'AI Jason calls YOYO "Vibe Versioning"', linkText: "Watch Now", linkUrl: "https://youtu.be/JfMcFjD-tIA?si=sSr6SIvZfGOth7QV", }, { id: "eric-tech", desktopText: 'Eric Tech just dropped: "Vibe Coding with Gemini AI." YOYO featured in the workflow.', mobileText: 'Eric Tech: "Vibe Coding with Gemini AI." YOYO featured.', linkText: "Watch Gemini Workflow", linkUrl: "https://youtu.be/AMeMeWjQmsY?si=hqXmTiIzDWzBUkn7", }, ] export default function AnnouncementBanner({ onVisibilityChange }: AnnouncementBannerProps) { const [isVisible, setIsVisible] = useState(true) const [currentBannerIndex, setCurrentBannerIndex] = useState(0) const [isTransitioning, setIsTransitioning] = useState(false) const [isPaused, setIsPaused] = useState(false) // const [slideDirection, setSlideDirection] = useState<"left" | "right">("right") const currentBanner = bannerInfos[currentBannerIndex] // Cycle through banners every 8 seconds useEffect(() => { if (!isVisible || bannerInfos.length <= 1 || isPaused) return const interval = setInterval(() => { setIsTransitioning(true) // Alternate slide direction for more dynamic feel // setSlideDirection((prev) => (prev === "right" ? "left" : "right")) setTimeout(() => { setCurrentBannerIndex((prev) => (prev + 1) % bannerInfos.length) setIsTransitioning(false) }, 300) // Half of transition duration }, 8000) // 8 seconds per banner - gives users more time to read return () => clearInterval(interval) }, [isVisible, isPaused]) const handleClose = () => { setIsVisible(false) onVisibilityChange?.(false) } useEffect(() => { onVisibilityChange?.(isVisible) }, [isVisible, onVisibilityChange]) if (!isVisible) return null const renderIcon = () => { // Show different icons based on banner type if (currentBanner.id === "visual-studio-magazine") { return ( ) } // YouTube icon for video content return ( ) } // Simplified transition - just opacity and subtle scale const simpleTransition = isTransitioning ? "opacity-0 transform scale-98" : "opacity-100 transform scale-100" return (

{/* Screen reader announcement for banner changes */}

{currentBanner.desktopText}

setIsPaused(true)} onMouseLeave={() => setIsPaused(false)} > {/* Single unified animation group - gradient bar + content together */}

{/* Gradient accent bar - now part of the main content group */}

{/* Icon with subtle staggered animation */}

{renderIcon()}

{/* Text content */} {currentBanner.desktopText} → {currentBanner.mobileText} → {currentBanner.linkText}

{/* Banner indicators - positioned absolutely to not affect centering */} {bannerInfos.length > 1 && (

{bannerInfos.map((_, index) => (

)} {/* Close button - positioned absolutely to not affect centering */}

) } [V0_FILE]jpg:file="public/apple-logo-silver-bitten-apple.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/apple-logo-silver-bitten-apple-AI3yxQm3zNCL4nAohk2SQdVJeZgEZz.jpg" isMerged="true" [V0_FILE]jpg:file="public/ibm-logo-blue-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/ibm-logo-blue-letters-coce74esaIYgqYoXrILgkUybZ8Anom.jpg" isMerged="true" [V0_FILE]jpg:file="public/google-logo-colorful-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/google-logo-colorful-letters-sF0WMiLfXIFCBA4PttGeMtEzD9jiQv.jpg" isMerged="true" [V0_FILE]jpg:file="public/ey-logo-yellow-black-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/ey-logo-yellow-black-letters-9YY5743PgLndhCSCfVRRA5McVOsmDB.jpg" isMerged="true" [V0_FILE]jpg:file="public/tesla-logo-red-t-symbol.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/tesla-logo-red-t-symbol-DU0EI7fF43ZUg78tx1hNmUMYmlDT0f.jpg" isMerged="true" [V0_FILE]jpg:file="public/netflix-logo-red-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/netflix-logo-red-letters-iWoHMvnOYGZzlbqejBZziFG5sjR6rM.jpg" isMerged="true" [V0_FILE]jpg:file="public/airbnb-logo-pink-coral-symbol.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/airbnb-logo-pink-coral-symbol-F9MN2LSqO8MplwCY8twpj1uEcntIrA.jpg" isMerged="true" [V0_FILE]jpg:file="public/dell-logo-blue-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/dell-logo-blue-letters-jJKvvQ7r6oMAd6oo2Y8YYmoECxcPyW.jpg" isMerged="true" [V0_FILE]jpg:file="public/adobe-logo-red-a-symbol.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/adobe-logo-red-a-symbol-on6c3qF0yu2CYcwbLCGc5Q8f9BreJM.jpg" isMerged="true" [V0_FILE]jpg:file="public/dropbox-logo-blue-box.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/dropbox-logo-blue-box-vu0EFSnFLxedPzwUXDZaGvlBaUZxGo.jpg" isMerged="true" [V0_FILE]jpg:file="public/zoho-logo-orange-red-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/zoho-logo-orange-red-letters-gH5UdpLq9rUjJKpEbZJWDZnJkjRhUP.jpg" isMerged="true" [V0_FILE]jpg:file="public/hilton-logo-blue-letters.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/hilton-logo-blue-letters-bnCJVs9S0uaTqEuFRNJuKaMPgp3nA2.jpg" isMerged="true" [V0_FILE]jpg:file="public/bank-of-america-logo-red-blue-flag.jpg" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/attachments/gen-images/public/bank-of-america-logo-red-blue-flag-BchidXIxFJ9wkXQ6acyINAXeUoP176.jpg" isMerged="true" [V0_FILE]png:file="public/logos/adobe-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/image-zCVNJbdyd8tzJUSaTVxCQZbJz6JMu8.png" isMerged="true" [V0_FILE]typescriptreact:file="app/test-logos/page.tsx" isMerged="true" "use client" export default function TestLogos() { return (

Company Logos Test

Testing all 13 company logos for visibility and accuracy

{/* First row - 6 logos */}

{/* Second row - 7 logos */}

) } function CompanyLogo({ name }: { name: string }) { const logoMap: Record = { Apple: "https://cdn.simpleicons.org/apple/white", IBM: "https://cdn.simpleicons.org/ibm/white", Google: "https://cdn.simpleicons.org/google", EY: "https://upload.wikimedia.org/wikipedia/commons/thumb/c/c8/EY_logo_2019.svg/320px-EY_logo_2019.svg.png", Tesla: "https://cdn.simpleicons.org/tesla/white", Netflix: "https://cdn.simpleicons.org/netflix", Airbnb: "https://cdn.simpleicons.org/airbnb/FF5A5F", Dell: "https://cdn.simpleicons.org/dell/007DB8", Adobe: "/logos/adobe-logo.png", Dropbox: "https://cdn.simpleicons.org/dropbox", Zoho: "https://www.zoho.com/branding/images/zoho-logo-512.png", Hilton: "https://upload.wikimedia.org/wikipedia/commons/thumb/f/f7/Hilton_Hotels_logo.svg/320px-Hilton_Hotels_logo.svg.png", "Bank of America": "https://upload.wikimedia.org/wikipedia/commons/thumb/8/89/Bank_of_America_logo.svg/320px-Bank_of_America_logo.svg.png", } const logoUrl = logoMap[name] const heightMap: Record = { Apple: "50px", IBM: "42px", Google: "40px", EY: "45px", Tesla: "45px", Netflix: "35px", Airbnb: "45px", Dell: "42px", Adobe: "48px", Dropbox: "42px", Zoho: "45px", Hilton: "40px", "Bank of America": "42px", } return (

{ console.log(`[v0] Failed to load logo for ${name}`) e.currentTarget.style.display = "none" const parent = e.currentTarget.parentElement if (parent) { const fallback = document.createElement("div") fallback.textContent = "❌" fallback.className = "text-4xl" parent.appendChild(fallback) } }} />

{name}

) } [V0_FILE]typescriptreact:file="components/save-review-restore-section.tsx" isQuickEdit="true" isMerged="true" "use client" import { useState, useRef, useEffect } from "react" import { Button } from "@/components/ui/button" import FeatureVideo from "@/components/feature-video" interface FeatureData { id: string title: string description: string videoSrc: string fallbackSrc?: string thumbnailSrc: string } const features: FeatureData[] = [ { id: "create", title: "Create Profile", description: "Build your skills-first profile — showcase your work, not your degree.", videoSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/yoyo-save-2-DUbUp5aKE9GtNY9Diok2eG6SW2qHCX.mp4", fallbackSrc: "/videos/save-review-restore.mp4", thumbnailSrc: "/images/save-thumbnail.jpeg", }, { id: "match", title: "Get Matched", description: "AI matches you with projects that fit your skills perfectly.", videoSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/yoyo-preview-dnsmAMg2AX6f1thlrNvj1e65T2zUTM.mp4", fallbackSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/save-review-restore-g3BK0sricXTSPMzxK4iGrmXBUwPt11.mp4", thumbnailSrc: "/images/preview-thumbnail.jpeg", }, { id: "work", title: "Start Working", description: "Get hired for projects and build your reputation.", videoSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/yoyo-restore-rhqD0huLa48Q51Sy9gzIrIdHk2vu2L.mp4", fallbackSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/save-review-restore-g3BK0sricXTSPMzxK4iGrmXBUwPt11.mp4", thumbnailSrc: "/images/restore-thumbnail.jpeg", }, ] interface SaveReviewRestoreSectionProps { onOpenInstall?: () => void } export default function SaveReviewRestoreSection({ onOpenInstall }: SaveReviewRestoreSectionProps) { const [activeFeature, setActiveFeature] = useState(features[0]) const [hoveredFeature, setHoveredFeature] = useState(null) const [videosLoaded, setVideosLoaded] = useState<{ [key: string]: boolean }>({}) const videoRefs = useRef<{ [key: string]: HTMLVideoElement | null }>({}) // Preload all videos when component mounts useEffect(() => { const loadedState = { ...videosLoaded } // Preload all videos but don't autoplay features.forEach((feature) => { const video = document.createElement("video") video.muted = true video.preload = "auto" video.playsInline = true video.loop = true // Remove autoplay - videos will be controlled by intersection observer video.onloadeddata = () => { setVideosLoaded((prev) => ({ ...prev, [feature.id]: true, })) } video.onerror = () => { if (feature.fallbackSrc) { video.src = feature.fallbackSrc } } video.src = feature.videoSrc loadedState[feature.id] = false }) setVideosLoaded(loadedState) }, []) const handleThumbnailHover = (feature: FeatureData) => { setHoveredFeature(feature.id) setActiveFeature(feature) } const handleThumbnailLeave = () => { setHoveredFeature(null) } const handleThumbnailClick = (feature: FeatureData) => { setActiveFeature(feature) } return (

{/* Title and Description outside the gradient section */}

Create, Match, Work

Getting hired shouldn't require a degree. Shiftza lets you prove your skills, get matched with companies, and start working on real projects.

{/* Gradient Section with Video - ORIGINAL DESIGN with overlay only on desktop */}

{/* Dark Overlay */}

{/* Noise Overlay */}

{/* Original Video Section */}

{/* Mobile Navigation Dots - Only visible on mobile */}

{features.map((feature, index) => (

{/* Gradient Overlay for Text Readability - HIDDEN on mobile and tablet */}

{/* Overlay Content on top of the video - HIDDEN on mobile and tablet */}

{/* Bottom Section: Content Left, Thumbnails Right */}

{/* Left: Feature Info and Install Button */}

{activeFeature.title}

{activeFeature.description}

{onOpenInstall && ( )}

{/* Right: Thumbnails - Now using actual YOYO interface images */}

{features.map((feature, index) => (

handleThumbnailHover(feature)} onMouseLeave={handleThumbnailLeave} onClick={() => handleThumbnailClick(feature)} >

{/* Thumbnail Label */}

{feature.title}

))}

) } [V0_FILE]typescriptreact:file="components/agentic-ai-search-section.tsx" isQuickEdit="true" isMerged="true" "use client" import { useState, useEffect, useRef } from "react" import { Button } from "@/components/ui/button" import { Play } from "lucide-react" import FeatureVideo from "@/components/feature-video" interface SearchQuery { id: string question: string videoSrc: string fallbackSrc?: string category: string } const searchQueries: SearchQuery[] = [ { id: "skills", question: "Show me React developers with 3+ years experience", videoSrc: "/videos/favorites.mp4", fallbackSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/favorites-FFCUeeEFzfxDBIhgGACi7YGpYQZbnU.mp4", category: "Talent", }, { id: "projects", question: "Find designers who worked on mobile apps", videoSrc: "/videos/update-windsurf.mp4", fallbackSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/update-windsurf-2nLOc5uJICad4940kOGQdrwE4nsXdo.mp4", category: "Portfolio", }, { id: "budget", question: "Show me projects under $5000 budget?", videoSrc: "/videos/dark-mode-search.mp4", fallbackSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/dark-mode-search-mSz6mUD1V8RUdjEfezII84ljPxeCyT.mp4", category: "Budget", }, { id: "verified", question: "Which developers have verified skills?", videoSrc: "/videos/did-v9.mp4", fallbackSrc: "https://hebbkx1anhila5yf.public.blob.vercel-storage.com/did-v9-sNyHkh5hs5gfnDH0tYkH15uK5syHUX.mp4", category: "Verified", }, ] interface AgenticAISearchSectionProps { onOpenInstall?: () => void } export default function AgenticAISearchSection({ onOpenInstall }: AgenticAISearchSectionProps) { const [activeQuery, setActiveQuery] = useState(searchQueries[0]) const [hoveredQuery, setHoveredQuery] = useState(null) const [videosLoaded, setVideosLoaded] = useState<{ [key: string]: boolean }>({}) const videoCache = useRef<{ [key: string]: HTMLVideoElement }>({}) const [isHovering, setIsHovering] = useState(false) // Improved video preloading without autoplay useEffect(() => { const preloadVideos = async () => { // Start with the first video (already active) setVideosLoaded({ [searchQueries[0].id]: true }) // Then preload the rest in the background for (const query of searchQueries) { if (query.id === searchQueries[0].id) continue try { const video = document.createElement("video") video.muted = true video.preload = "auto" video.playsInline = true video.loop = true // Remove autoplay - controlled by intersection observer videoCache.current[query.id] = video video.src = query.videoSrc setTimeout(() => { setVideosLoaded((prev) => ({ ...prev, [query.id]: true })) }, 1000) video.onerror = () => { if (query.fallbackSrc) { video.src = query.fallbackSrc } } } catch (error) { console.warn(`Failed to preload video for query ${query.id}:`, error) } } } preloadVideos() return () => { Object.values(videoCache.current).forEach((video) => { video.src = "" video.load() }) videoCache.current = {} } }, []) const handleQueryClick = (query: SearchQuery) => { setActiveQuery(query) } // Simplified hover handling - no delay const handleQueryHover = (query: SearchQuery) => { if (isHovering) { setHoveredQuery(query.id) setActiveQuery(query) } } const handleSectionEnter = () => { setIsHovering(true) } const handleSectionLeave = () => { setIsHovering(false) setHoveredQuery(null) } const getCategoryColor = (category: string) => { switch (category) { case "Talent": return "bg-cyan-500/20 text-cyan-300 border-cyan-400/30" case "Portfolio": return "bg-orange-500/20 text-orange-300 border-orange-400/30" case "Budget": return "bg-pink-500/20 text-pink-300 border-pink-400/30" case "Verified": return "bg-purple-500/20 text-purple-300 border-purple-400/30" default: return "bg-white/20 text-white border-white/30" } } return (

{/* Title and Description */}

Smart AI Matching

Ask anything. Shiftza understands your skills, experience, and project needs — matching talent with opportunities perfectly.

{/* Gradient Section with Video */}

{/* Dark Overlay */}

{/* Noise Overlay */}

{/* Video Section */}

{/* FIXED ASPECT RATIO CONTAINER */}

{/* Mobile Navigation Dots - Only visible on mobile */}

{searchQueries.map((query, index) => (

{/* Gradient Overlay for Text Readability - HIDDEN on mobile and tablet */}

{/* Overlay Content on top of the video - HIDDEN on mobile and tablet */}

{/* Bottom Section: Content Left, Query Buttons Right */}

{/* Left: Feature Info and Install Button - KEEPING ORIGINAL DESIGN */}

AI Search

"{activeQuery.question}"

{onOpenInstall && ( )}

{/* Right: Enhanced Query Buttons - FIXED WIDTH CONTAINER */}

{/* Fixed width container for all buttons to prevent layout shifts */}

{searchQueries.map((query) => ( ))}

) } [V0_FILE]typescriptreact:file="components/why-not-git-section.tsx" isMerged="true" "use client" import { Button } from "@/components/ui/button" import { Lightbulb, Save, Users, SeparatorHorizontal } from "lucide-react" interface WhyNotGitSectionProps { onOpenInstall?: () => void } export default function WhyNotGitSection({ onOpenInstall }: WhyNotGitSectionProps) { const features = [ { icon: Save, title: "Traditional hiring wants degrees.", description: "Shiftza values skills — no need for expensive credentials or formal education.", }, { icon: SeparatorHorizontal, title: "Job boards are cluttered with irrelevant listings.", description: "Shiftza matches you with projects that fit your actual skills.", }, { icon: Users, title: "Hiring platforms are built for HR departments.", description: "Shiftza works for skilled professionals, freelancers, and project-based workers.", }, { icon: Lightbulb, title: "Traditional jobs require long-term commitment.", description: "Shiftza is for flexible work — take projects when you want, scale as you grow.", }, ] return (

{/* Header */}

Why Not Just Use Job Boards?

Job boards are for resumes. Shiftza is for skills.

{/* Features Grid */}

{features.map((feature, index) => (

{feature.title}

{feature.description}

))}

{/* Call to Action */}

Stop worrying about degrees. Start showcasing your skills.

{onOpenInstall && ( )}

) } [V0_FILE]typescriptreact:file="components/testimonials-section.tsx" isMerged="true" "use client" import { Quote } from "lucide-react" export default function TestimonialsSection() { return (

{/* Quote Icon */}

{/* YouTube Play Indicator */}

{/* Main Content */}

{/* Image */}

{/* Quote and Attribution */}

"Skills-First Hiring is the{" "} Future of Work "

{/* Attribution */}

{/* Gradient Border Effect */}

{/* Bottom Text */}

Shiftza empowers skilled professionals to prove their worth and access opportunities that traditional hiring would never offer.

) } [V0_FILE]typescriptreact:file="components/faq-section.tsx" isQuickEdit="true" isMerged="true" "use client" import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion" import { Button } from "@/components/ui/button" const faqs = [ { question: "Do I really not need a degree to join?", answer: ( <> Absolutely not.

Shiftza is built for skilled professionals — whether you're self-taught, bootcamp-trained, or learned on the job.

We verify your skills through portfolios, tests, and real work — not diplomas. ), }, { question: "Is it free to join?", answer: ( <> Yes — creating a profile and applying to projects is completely free.

We only take a small commission when you successfully complete a paid project. ), }, { question: "How do you verify skills without degrees?", answer: ( <> We use multiple verification methods:

Portfolio reviews, skill assessments, peer endorsements, and most importantly — your actual work on the platform builds your reputation. ), }, { question: "What kind of projects can I find?", answer: ( <> Everything from short-term gigs to long-term contracts.

Web development, mobile apps, design, data analysis, content creation, and more.

Companies post projects ranging from $500 to $50,000+. ), }, { question: "How does payment work?", answer: ( <> All payments go through our secure escrow system.

Companies fund projects upfront, and you get paid when milestones are completed.

No chasing invoices. No payment disputes. ), }, { question: "Can companies really hire without worrying about layoffs?", answer: ( <> Yes — that's the whole point.

Project-based hiring means companies scale up when they need talent and scale down naturally when projects end.

No awkward layoffs. No severance packages. Just flexible collaboration. ), }, ] interface FAQSectionProps { onOpenInstall?: () => void } export default function FAQSection({ onOpenInstall }: FAQSectionProps) { return (

Questions You Might Be Wondering

{faqs.map((faq, index) => ( {faq.question}

{faq.answer}

))} {/* Call to action */}

Still unsure? Create your profile in 5 minutes — you'll see why skills matter more than degrees.

{onOpenInstall && ( )}

) } [V0_FILE]png:file="public/images/shiftza-logo.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]png:file="public/favicon.ico" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]png:file="public/favicon-16x16.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]png:file="public/favicon-32x32.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]png:file="public/apple-touch-icon.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]png:file="public/android-chrome-192x192.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]png:file="public/android-chrome-512x512.png" url="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/Picsart_25-10-06_23-22-59-176%281%29%281%29-Ca83bJ2Wb4AKSXQvYCkvm8HWHKJ3G1.png" isMerged="true" [V0_FILE]typescriptreact:file="app/icon.tsx" isMerged="true" import { ImageResponse } from "next/og" export const runtime = "edge" export const size = { width: 32, height: 32, } export const contentType = "image/png" export default function Icon() { return new ImageResponse(

, { ...size, }, ) } [V0_FILE]typescriptreact:file="app/apple-icon.tsx" isMerged="true" import { ImageResponse } from "next/og" export const runtime = "edge" export const size = { width: 180, height: 180, } export const contentType = "image/png" export default function AppleIcon() { return new ImageResponse(

, { ...size, }, ) } [V0_FILE]typescriptreact:file="app/layout.tsx" isQuickEdit="true" isMerged="true" import type React from "react" import "./globals.css" import type { Metadata } from "next" import BackButton from "@/components/back-button" export const metadata: Metadata = { title: "Shiftza – Skills Lead, Not CVs.", description: "Millions of skilled workers remain unseen — Shiftza is the premier skills-first talent platform where professionals without degrees can prove their worth and access real opportunities.", keywords: "skills-first hiring, non-degree professionals, talent platform, prove your skills, access opportunities", authors: [{ name: "Shiftza Team" }], creator: "Shiftza", publisher: "Shiftza", robots: { index: true, follow: true, googleBot: { index: true, follow: true, "max-video-preview": -1, "max-image-preview": "large", "max-snippet": -1, }, }, openGraph: { type: "website", locale: "en_US", url: "https://runyoyo.com", siteName: "Shiftza", title: "Shiftza – Skills Lead, Not CVs.", description: "Millions of skilled workers remain unseen — Shiftza is the premier skills-first talent platform where professionals without degrees can prove their worth and access real opportunities.", images: [ { url: "https://runyoyo.com/images/og-new.jpeg", width: 1200, height: 630, alt: "Shiftza skills-first talent platform", type: "image/jpeg", }, ], }, twitter: { card: "summary_large_image", title: "Shiftza – Skills Lead, Not CVs.", description: "Millions of skilled workers remain unseen — Shiftza is the premier skills-first talent platform where professionals without degrees can prove their worth and access real opportunities.", images: ["https://runyoyo.com/images/og-new.jpeg"], creator: "@jackjack_eth", site: "@yoyo_dev", }, alternates: { canonical: "https://runyoyo.com", }, category: "Technology", classification: "Developer Tools", generator: "Next.js", applicationName: "Shiftza", referrer: "origin-when-cross-origin", formatDetection: { email: false, address: false, telephone: false, }, } export default function RootLayout({ children, }: { children: React.ReactNode }) { return ( {/* Software Application JSON-LD */}

About

Tags

Share

About

Tags

Share

More Templates Like This

More Templates Like This