-
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.
- Loading branch information
1 parent
b10455c
commit a8be54e
Showing
12 changed files
with
283 additions
and
110 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| { | ||
| "$schema": "https://ui.shadcn.com/schema.json", | ||
| "style": "default", | ||
| "rsc": false, | ||
| "tsx": true, | ||
| "tailwind": { | ||
| "config": "tailwind.config.js", | ||
| "css": "src/index.css", | ||
| "baseColor": "slate", | ||
| "cssVariables": true, | ||
| "prefix": "" | ||
| }, | ||
| "aliases": { | ||
| "components": "@/components", | ||
| "utils": "@/lib/utils" | ||
| } | ||
| } |
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 |
|---|---|---|
| @@ -1,8 +1,3 @@ | ||
| ``` | ||
| npm install | ||
| npm run dev | ||
| ``` | ||
| # Cloudflare Worker Handling /api | ||
|
|
||
| ``` | ||
| npm run deploy | ||
| ``` | ||
| Uses Cloudflare D1 for storage, with Drizzle ORM. |
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 |
|---|---|---|
| @@ -1,35 +1,103 @@ | ||
| import { useState } from 'react' | ||
| import reactLogo from './assets/react.svg' | ||
| import viteLogo from '/vite.svg' | ||
| import './App.css' | ||
| import { useState } from 'react'; | ||
| import { Copy, Link, AlertCircle } from 'lucide-react'; | ||
| import { type RequestSecretSchema } from '../secret-worker/src/db/schema' | ||
|
|
||
| function App() { | ||
| const [count, setCount] = useState(0) | ||
| const OneTimeSecret = () => { | ||
| const [secret, setSecret] = useState(''); | ||
| const [generatedLink, setGeneratedLink] = useState(''); | ||
| const [inputEnabled, setInputEnabled] = useState(true); | ||
| const [error, setError] = useState(''); | ||
|
|
||
| const handleCreateLink = () => { | ||
| const data = secret.trim(); | ||
| if (!data.trim()) { | ||
| setError('Please enter a secret to create a link.'); | ||
| return; | ||
| } | ||
|
|
||
| setInputEnabled(false); | ||
|
|
||
| const fetchData = async () => { | ||
| const response = await fetch('/api/new', { | ||
| method: 'POST', | ||
| headers: { | ||
| 'Content-Type': 'application/json', | ||
| }, | ||
| body: JSON.stringify({ data: data.trim() } as RequestSecretSchema), | ||
| }); | ||
|
|
||
| if (response.ok) { | ||
| const data = await response.json(); | ||
| setGeneratedLink(`${window.location.origin}/secret/${data.id}`); | ||
| } else { | ||
| setGeneratedLink(''); | ||
| setError('An error occurred while creating the secret link. Please refresh and try again.'); | ||
| } | ||
| }; | ||
|
|
||
| fetchData(); | ||
| } | ||
|
|
||
| const handleCopyLink = () => { | ||
| navigator.clipboard.writeText(generatedLink); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| <div> | ||
| <a href="https://vitejs.dev" target="_blank"> | ||
| <img src={viteLogo} className="logo" alt="Vite logo" /> | ||
| </a> | ||
| <a href="https://react.dev" target="_blank"> | ||
| <img src={reactLogo} className="logo react" alt="React logo" /> | ||
| </a> | ||
| </div> | ||
| <h1>Vite + React</h1> | ||
| <div className="card"> | ||
| <button onClick={() => setCount((count) => count + 1)}> | ||
| count is {count} | ||
| <div className="min-h-screen bg-gradient-to-br from-gray-900 to-gray-800 flex items-center justify-center p-4"> | ||
| <div className="bg-gray-800 rounded-lg shadow-xl p-6 w-full max-w-md border border-gray-700"> | ||
| <h1 className="text-2xl font-bold text-gray-100 mb-4 text-center">Create One-Time Secret</h1> | ||
| <textarea | ||
| className="w-full h-32 p-2 border border-gray-600 rounded-md focus:ring-2 focus:ring-purple-500 focus:border-transparent resize-none bg-gray-700 text-gray-100 disabled:opacity-50 disabled:cursor-not-allowed" | ||
| placeholder="Enter your secret here..." | ||
| value={secret} | ||
| onChange={(e) => setSecret(e.target.value)} | ||
| disabled={!inputEnabled} | ||
| maxLength={10000} | ||
| /> | ||
| <button | ||
| className={`mt-4 w-full bg-purple-600 text-white font-bold py-2 px-4 rounded-md transition duration-300 ease-in-out flex items-center justify-center ${!generatedLink | ||
| ? 'hover:bg-purple-700 hover:shadow-lg transform hover:-translate-y-0.5' | ||
| : 'opacity-50 cursor-not-allowed' | ||
| }`} | ||
| onClick={handleCreateLink} | ||
| disabled={!inputEnabled} | ||
| > | ||
| <Link className="mr-2" size={18} /> | ||
| Create Secret Link | ||
| </button> | ||
| <p> | ||
| Edit <code>src/App.tsx</code> and save to test HMR | ||
| </p> | ||
|
|
||
| {generatedLink && ( | ||
| <div className="mt-4"> | ||
| <p className="text-sm text-gray-400 mb-2">Your secret link:</p> | ||
| <div className="flex items-center bg-gray-700 p-2 rounded-md"> | ||
| <input | ||
| type="text" | ||
| readOnly | ||
| value={generatedLink} | ||
| className="flex-grow bg-transparent text-sm text-gray-300 focus:outline-none" | ||
| /> | ||
| <button | ||
| onClick={handleCopyLink} | ||
| className="ml-2 text-purple-400 hover:text-purple-300 transition duration-300 ease-in-out transform hover:scale-110" | ||
| title="Copy to clipboard" | ||
| > | ||
| <Copy size={18} /> | ||
| </button> | ||
| </div> | ||
| </div> | ||
| )} | ||
|
|
||
| {error && ( | ||
| <div className="mt-4 bg-red-900 border border-red-700 text-red-100 px-4 py-3 rounded relative" role="alert"> | ||
| <div className="flex items-center"> | ||
| <AlertCircle className="mr-2" size={18} /> | ||
| <span className="block sm:inline pl-2 pr-2">{error}</span> | ||
| </div> | ||
| </div> | ||
| )} | ||
| </div> | ||
| <p className="read-the-docs"> | ||
| Click on the Vite and React logos to learn more | ||
| </p> | ||
| </> | ||
| ) | ||
| } | ||
|
|
||
| export default App | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default OneTimeSecret; |
This file was deleted.
Oops, something went wrong.
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,6 @@ | ||
| import { type ClassValue, clsx } from "clsx" | ||
| import { twMerge } from "tailwind-merge" | ||
|
|
||
| export function cn(...inputs: ClassValue[]) { | ||
| return twMerge(clsx(inputs)) | ||
| } |
Oops, something went wrong.