diff --git a/apps/web/src/app/not-found.tsx b/apps/web/src/app/not-found.tsx new file mode 100644 index 0000000..9f45dd2 --- /dev/null +++ b/apps/web/src/app/not-found.tsx @@ -0,0 +1,264 @@ +"use client"; + +import { useState, useEffect, useMemo } from "react"; +import Link from "next/link"; +import { motion } from "framer-motion"; +import { Home, ArrowLeft, Github, BookOpen, Globe } from "lucide-react"; + +// Glitch text effect +function GlitchText({ text }: { text: string }) { + const [glitchedText, setGlitchedText] = useState(text); + + useEffect(() => { + const glitchChars = "!@#$%^&*()_+-=[]{}|;:,.<>?"; + let interval: NodeJS.Timeout; + + const startGlitch = () => { + let iterations = 0; + interval = setInterval(() => { + setGlitchedText( + text + .split("") + .map((char, index) => { + if (index < iterations) return text[index]; + return glitchChars[Math.floor(Math.random() * glitchChars.length)]; + }) + .join("") + ); + iterations += 1 / 3; + if (iterations >= text.length) { + clearInterval(interval); + setGlitchedText(text); + } + }, 30); + }; + + startGlitch(); + const loopInterval = setInterval(startGlitch, 5000); + + return () => { + clearInterval(interval); + clearInterval(loopInterval); + }; + }, [text]); + + return {glitchedText}; +} + +// Floating binary particles +function BinaryParticle({ delay }: { delay: number }) { + /* eslint-disable react-hooks/purity */ + const { binary, left, duration } = useMemo(() => ({ + binary: Math.random() > 0.5 ? "1" : "0", + left: Math.random() * 100, + duration: 5 + Math.random() * 5 + }), []); + /* eslint-enable react-hooks/purity */ + + return ( + + {binary} + + ); +} + +export default function NotFound() { + const [mounted, setMounted] = useState(false); + const [currentPath, setCurrentPath] = useState(""); + + useEffect(() => { + setMounted(true); + setCurrentPath(window.location.pathname); + }, []); + + // Generate stable random delays for particles + /* eslint-disable react-hooks/purity */ + const particleDelays = useMemo(() => { + return Array.from({ length: 20 }, () => Math.random() * 3); + }, []); + /* eslint-enable react-hooks/purity */ + + if (!mounted) return null; + + return ( +
+ {/* Binary rain */} +
+ {particleDelays.map((delay, i) => ( + + ))} +
+ + {/* Grid pattern */} +
+ + {/* Noise overlay */} +
+
+
+ + {/* Gradient orbs */} +
+
+ + {/* Content */} +
+ {/* Large 404 */} + +

+ 404 +

+ {/* Glitch layers */} +
+ 404 +
+
+ 404 +
+ + + {/* Terminal window */} + + {/* Terminal header */} +
+
+
+
+
+
+ + system.error + +
+ + {/* Terminal content */} +
+
+ [ERROR] Route not found +
+
+ → requested: "{currentPath}" +
+
+ → status: NOT_FOUND +
+
+ $ + redirect --to + /home + +
+
+ + + {/* Error message */} + +

+ +

+

+ The algorithm you're searching for doesn't exist in our registry. + Perhaps it's still being visualized somewhere in the void. +

+ + + {/* Action buttons */} + + + + Back to Home + + + + + + {/* Helpful links */} + + + + Launch App + + + + Documentation + + + + GitHub + + + + {/* Fun message */} + + Error code: ALGORITHM_NOT_IN_REGISTRY • Time complexity: O(404) + +
+
+ ); +} diff --git a/apps/web/src/components/sections/algorithm-checklist.tsx b/apps/web/src/components/sections/algorithm-checklist.tsx index 8d1bc93..cb5d2dd 100644 --- a/apps/web/src/components/sections/algorithm-checklist.tsx +++ b/apps/web/src/components/sections/algorithm-checklist.tsx @@ -153,7 +153,7 @@ export function AlgorithmChecklist() {

{total}+ algorithms and data structures. This is what we're building together. - Pick one and contribute, or suggest new ones. ML/DL, algorithms from other fields, and visualizers are all welcome. + Pick one and contribute, or suggest new ones. ML/DL, Maths, Physics, algorithms from other fields, and visualizers are all welcome.

{/* Progress bar */} @@ -263,7 +263,7 @@ export function AlgorithmChecklist() { >

Open to Contributions:{" "} - Machine Learning & Deep Learning Algorithm Visualizers etc... + Machine Learning, Deep Learning, Physics, Math, Algorithm Visualizers etc...

diff --git a/apps/web/src/components/ui/particles-background.tsx b/apps/web/src/components/ui/particles-background.tsx index a78d770..896fb61 100644 --- a/apps/web/src/components/ui/particles-background.tsx +++ b/apps/web/src/components/ui/particles-background.tsx @@ -2,7 +2,7 @@ import { useCallback, useEffect, useMemo, useState } from "react"; import Particles, { initParticlesEngine } from "@tsparticles/react"; -import { type Container, type ISourceOptions } from "@tsparticles/engine"; +import { type ISourceOptions } from "@tsparticles/engine"; import { loadSlim } from "@tsparticles/slim"; export function ParticlesBackground() { diff --git a/apps/web/src/lib/algorithms-data.ts b/apps/web/src/lib/algorithms-data.ts index af0b8d8..805c9d5 100644 --- a/apps/web/src/lib/algorithms-data.ts +++ b/apps/web/src/lib/algorithms-data.ts @@ -27,7 +27,7 @@ export const categories: AlgorithmCategories = { items: { Arrays: { topics: [ - { name: "Basic Array Operations", implemented: true }, + { name: "Basic Array Operations", implemented: false }, { name: "Dynamic Arrays", implemented: false }, { name: "Multi-dimensional Arrays", implemented: false }, ], @@ -95,7 +95,7 @@ export const categories: AlgorithmCategories = { items: { "Sorting (Easy)": { topics: [ - { name: "Bubble Sort", implemented: true }, + { name: "Bubble Sort", implemented: false }, { name: "Selection Sort", implemented: false }, { name: "Insertion Sort", implemented: false }, ], @@ -116,7 +116,7 @@ export const categories: AlgorithmCategories = { }, Searching: { topics: [ - { name: "Linear Search", implemented: true }, + { name: "Linear Search", implemented: false }, { name: "Binary Search", implemented: false }, { name: "Jump Search", implemented: false }, { name: "Exponential Search", implemented: false },