-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fix build issues and enhance UI components
- Fixed TypeScript errors in resume page - Added missing icons to components/icons.tsx - Created Progress component - Fixed React Hook dependencies in AudioEffectsProcessor - Added new audio-recorder and blog pages - Updated navigation and layout components
- Loading branch information
1 parent
06d43db
commit b5df1c9
Showing
18 changed files
with
866 additions
and
178 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,83 @@ | ||
| 'use client'; | ||
|
|
||
| import { useEffect, useState } from 'react'; | ||
| import { Card } from "@/components/ui/card"; | ||
| import { Button } from "@/components/ui/button"; | ||
| import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@/components/ui/dialog"; | ||
| import dynamic from 'next/dynamic'; | ||
|
|
||
| // Dynamically import react-confetti to avoid SSR issues | ||
| const Confetti = dynamic(() => import('react-confetti'), { | ||
| ssr: false | ||
| }); | ||
|
|
||
| export default function AudioRecorderPage() { | ||
| const [showConfetti, setShowConfetti] = useState(true); | ||
| const [showDialog, setShowDialog] = useState(true); | ||
| const [windowSize, setWindowSize] = useState({ | ||
| width: typeof window !== 'undefined' ? window.innerWidth : 0, | ||
| height: typeof window !== 'undefined' ? window.innerHeight : 0 | ||
| }); | ||
|
|
||
| useEffect(() => { | ||
| const handleResize = () => { | ||
| setWindowSize({ | ||
| width: window.innerWidth, | ||
| height: window.innerHeight | ||
| }); | ||
| }; | ||
|
|
||
| window.addEventListener('resize', handleResize); | ||
| return () => window.removeEventListener('resize', handleResize); | ||
| }, []); | ||
|
|
||
| useEffect(() => { | ||
| // Hide confetti after 5 seconds | ||
| const timer = setTimeout(() => { | ||
| setShowConfetti(false); | ||
| }, 5000); | ||
|
|
||
| return () => clearTimeout(timer); | ||
| }, []); | ||
|
|
||
| return ( | ||
| <div className="container mx-auto px-4 py-8"> | ||
| {showConfetti && ( | ||
| <Confetti | ||
| width={windowSize.width} | ||
| height={windowSize.height} | ||
| recycle={false} | ||
| numberOfPieces={200} | ||
| /> | ||
| )} | ||
|
|
||
| <Dialog open={showDialog} onOpenChange={setShowDialog}> | ||
| <DialogContent> | ||
| <DialogHeader> | ||
| <DialogTitle className="text-2xl font-bold text-center mb-4"> | ||
| 🎉 Congratulations! 🎉 | ||
| </DialogTitle> | ||
| </DialogHeader> | ||
| <div className="text-center space-y-4"> | ||
| <p className="text-muted-foreground"> | ||
| You've discovered the secret audio recorder page! | ||
| </p> | ||
| <Button onClick={() => setShowDialog(false)}> | ||
| Let's Begin! | ||
| </Button> | ||
| </div> | ||
| </DialogContent> | ||
| </Dialog> | ||
|
|
||
| <Card className="p-6"> | ||
| <div className="space-y-4"> | ||
| <h1 className="text-3xl font-bold">Audio Recorder</h1> | ||
| <p className="text-muted-foreground"> | ||
| This is a hidden page where you can record and play audio. | ||
| </p> | ||
| {/* Audio recorder component will go here */} | ||
| </div> | ||
| </Card> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,47 @@ | ||
| import Link from 'next/link' | ||
|
|
||
| export default function HelloWorldPost() { | ||
| return ( | ||
| <div className="container mx-auto px-4 py-8"> | ||
| <div className="max-w-4xl mx-auto"> | ||
| <div className="mb-8"> | ||
| <Link | ||
| href="/blog" | ||
| className="inline-flex items-center px-4 py-2 rounded-md bg-secondary hover:bg-secondary/80 transition-colors" | ||
| > | ||
| Back | ||
| </Link> | ||
| </div> | ||
|
|
||
| <article className="prose prose-invert max-w-none"> | ||
| <h1>Hello World</h1> | ||
| <p className="text-muted-foreground"> | ||
| You've seen so many videos and blogs mention 'Hello World', but do you really know what it means? | ||
| </p> | ||
|
|
||
| <div className="text-sm text-muted-foreground mb-8"> | ||
| <span>Written by John Doe</span> | ||
| <span className="mx-2">•</span> | ||
| <span>Sep 20, 2024</span> | ||
| </div> | ||
|
|
||
| <h2>What is "Hello World"?</h2> | ||
| <p> | ||
| "Hello World" is essentially a way to confirm that everything is working as expected. When | ||
| you write and run this program, it outputs the phrase "Hello, World!" to the screen, showing | ||
| that your environment is set up correctly. Every programming language has its own | ||
| syntax for doing this, and it's the perfect way to get comfortable with the basics. | ||
| </p> | ||
|
|
||
| <h2>A Simple Example in Python:</h2> | ||
| <pre><code className="language-python">print("Hello, World!")</code></pre> | ||
|
|
||
| <p> | ||
| That's it! Running this code will output the text to the console, and boom—you've just | ||
| written your first Python program. | ||
| </p> | ||
| </article> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| import Link from 'next/link' | ||
|
|
||
| export default function BlogPage() { | ||
| return ( | ||
| <div className="container mx-auto px-4 py-8"> | ||
| <div className="max-w-4xl mx-auto"> | ||
| <h1 className="text-4xl font-bold mb-8">Blog</h1> | ||
|
|
||
| <div className="space-y-8"> | ||
| <article className="bg-card rounded-lg p-6 hover:bg-card/80 transition-colors"> | ||
| <Link href="/blog/hello-world"> | ||
| <h2 className="text-3xl font-bold mb-2 hover:underline">Hello World</h2> | ||
| <p className="text-muted-foreground mb-4"> | ||
| You've seen so many videos and blogs mention 'Hello World', but do you really know what it means? | ||
| </p> | ||
| <div className="text-sm text-muted-foreground"> | ||
| <span>Written by John Doe</span> | ||
| <span className="mx-2">•</span> | ||
| <span>Sep 20, 2024</span> | ||
| </div> | ||
| </Link> | ||
| </article> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.