math-pixel/upload-gltf
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update: add gitgnore

Browse Source
This commit is contained in:
Tom Boullay
2026-04-03 10:41:56 +02:00
parent a730946ad2
commit 5007a255da
9 changed files with 427 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.gitignore
+34
View File
@@ -0,0 +1,34 @@
# Dependencies
node_modules/
.pnp
.pnp.js
# Testing
coverage/
# Next.js
.next/
out/
# Production
build/
# Misc
.DS_Store
*.pem
# Debug
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Local env files
.env*.local
.env
# Vercel
.vercel
# TypeScript
*.tsbuildinfo
next-env.d.ts
README.md
+151
View File
@@ -1 +1,152 @@
# upload-GLTF # upload-GLTF
A secure upload interface for 3D assets with automatic deployment to GitHub via Git LFS.
## Description
This is a Next.js web application that allows designers and developers to upload 3D models and textures via a modern drag-and-drop interface. Uploaded files are automatically committed and pushed to a GitHub repository using Git LFS for efficient version control of large binary files.
## Features
- **Drag-and-drop upload** for 3D models (.glb, .gltf, .fbx) and textures (.png, .jpg, .jpeg, .webp, .ktx2)
- **2 GB max** file size per upload
- **Automatic Git deployment** — files are committed and pushed to GitHub via Git LFS
- **Secret key authentication** for secure uploads
- **Modern UI** built with Tailwind CSS and React
## Prerequisites
- Node.js 18+
- npm or yarn
## Installation
```bash
git clone <repo-url>
cd upload-GLTF
npm install
```
## Configuration
### Environment Variables
Create a `.env.local` file in the root directory:
```env
UPLOAD_SECRET_KEY=your-secret-key-here
GIT_BRANCH=main
GIT_REPO_URL=git@github.com:username/repo.git
```
| Variable | Description | Required |
|----------|-------------|----------|
| `UPLOAD_SECRET_KEY` | Secret key for authentication | Yes |
| `GIT_BRANCH` | Git branch to push to (default: main) | No |
| `GIT_REPO_URL` | Git repository URL for SSH push | No |
### Git LFS Setup
Install Git LFS and track the asset file types by creating a `.gitattributes` file:
```bash
git lfs install
```
Create `.gitattributes`:
```
*.glb filter=lfs diff=lfs merge=lfs -text
*.gltf filter=lfs diff=lfs merge=lfs -text
*.fbx filter=lfs diff=lfs merge=lfs -text
*.png filter=lfs diff=lfs merge=lfs -text
*.jpg filter=lfs diff=lfs merge=lfs -text
*.jpeg filter=lfs diff=lfs merge=lfs -text
*.webp filter=lfs diff=lfs merge=lfs -text
*.ktx2 filter=lfs diff=lfs merge=lfs -text
```
## Usage
### Development
```bash
npm run dev
```
Access the app at `http://localhost:3000`
### Production
```bash
npm run build
npm start
```
### Lint
```bash
npm run lint
```
## Docker Deployment
### Docker Compose
Create `docker-compose.yml`:
```yaml
services:
app:
build: .
ports:
- "3000:3000"
environment:
- UPLOAD_SECRET_KEY=your-secret-key
- GIT_BRANCH=main
- GIT_REPO_URL=git@github.com:username/repo.git
volumes:
- ./public:/app/public
- ~/.ssh:/root/.ssh
```
Build and run:
```bash
docker-compose up --build
```
### Coolify
The Dockerfile is optimized for Coolify deployment. Configure environment variables through the Coolify interface.
## Project Structure
```
.
├── app/
│ ├── api/upload/route.ts # Upload API + git push
│ ├── globals.css
│ ├── layout.tsx
│ └── page.tsx
├── components/
│ └── UploadZone.tsx # Upload component
├── public/
│ ├── models/ # Uploaded 3D models
│ └── textures/ # Uploaded textures
├── Dockerfile
├── package.json
├── tailwind.config.ts
└── tsconfig.json
```
## Supported File Formats
| Type | Extensions |
|------|------------|
| 3D Models | .glb, .gltf, .fbx |
| Textures | .png, .jpg, .jpeg, .webp, .ktx2 |
## License
MIT
app/globals.css
+2 -11
View File
@@ -1,4 +1,5 @@
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');
@tailwind base; @tailwind base;
@tailwind components; @tailwind components;
@@ -10,16 +11,6 @@
} }
body { body {
@apply bg-surface-soft text-gray-800 antialiased; @apply bg-black-900 text-gray-100 antialiased;
}
}
@layer utilities {
.text-gradient {
@apply bg-gradient-to-r from-brand-500 to-rose-400 bg-clip-text text-transparent;
}
.bg-gradient-brand {
@apply bg-gradient-to-r from-brand-500 to-rose-400;
} }
} }
app/page.tsx
+10 -17
View File
@@ -2,32 +2,25 @@ import UploadZone from '@/components/UploadZone'
export default function Home() { export default function Home() {
return ( return (
<main className="min-h-screen bg-surface-soft flex flex-col items-center justify-center p-6"> <main className="min-h-screen bg-black-900 flex flex-col items-center justify-center p-6">
{/* Header */}
<div className="w-full max-w-2xl mb-10 text-center"> <div className="w-full max-w-2xl mb-10 text-center">
<div className="inline-flex items-center gap-2 mb-4 px-3 py-1 rounded-full bg-brand-100 border border-brand-200 text-brand-600 text-xs font-medium uppercase tracking-widest"> <h1 className="text-4xl font-bold tracking-tight mb-3 text-white">
<span className="w-1.5 h-1.5 rounded-full bg-brand-500 animate-pulse" /> Upload GLTF
Git LFS · Déploiement continu
</div>
<h1 className="text-4xl font-bold tracking-tight mb-3">
<span className="text-gradient">Asset Bridge 3D</span>
</h1> </h1>
<p className="text-gray-500 text-base leading-relaxed"> <p className="text-gray-400 text-base leading-relaxed">
Déposez vos fichiers 3D — ils seront automatiquement versionnés Drop your 3D files — they will be automatically versioned
<br />et poussés sur le dépôt GitHub via Git LFS. <br />and pushed to your GitHub repository via Git LFS.
</p> </p>
</div> </div>
{/* Upload Zone */}
<UploadZone /> <UploadZone />
{/* Footer */} <footer className="mt-10 text-gray-500 text-xs text-center">
<footer className="mt-10 text-gray-400 text-xs text-center"> Models: <span className="font-mono text-gray-400">.glb · .gltf · .fbx</span>
Modèles : <span className="font-mono text-gray-500">.glb · .gltf · .fbx</span>
<span className="mx-2">·</span> <span className="mx-2">·</span>
Textures : <span className="font-mono text-gray-500">.png · .jpg · .webp · .ktx2</span> Textures: <span className="font-mono text-gray-400">.png · .jpg · .webp · .ktx2</span>
<span className="mx-2">·</span> <span className="mx-2">·</span>
Taille max : <span className="font-mono text-gray-500">2 GB</span> Max size: <span className="font-mono text-gray-400">2 GB</span>
</footer> </footer>
</main> </main>
) )
components/UploadZone.tsx
+65 -92
View File
@@ -3,9 +3,6 @@
import { useCallback, useRef, useState } from 'react' import { useCallback, useRef, useState } from 'react'
import { useDropzone, FileRejection } from 'react-dropzone' import { useDropzone, FileRejection } from 'react-dropzone'
// ─────────────────────────────────────────────
// Types
// ─────────────────────────────────────────────
type FileStatus = 'pending' | 'uploading' | 'success' | 'error' type FileStatus = 'pending' | 'uploading' | 'success' | 'error'
interface FileEntry { interface FileEntry {
@@ -25,9 +22,6 @@ interface UploadResult {
gitError?: string gitError?: string
} }
// ─────────────────────────────────────────────
// Formats acceptés
// ─────────────────────────────────────────────
const ACCEPTED_FORMATS = { const ACCEPTED_FORMATS = {
'model/gltf-binary': ['.glb'], 'model/gltf-binary': ['.glb'],
'model/gltf+json': ['.gltf'], 'model/gltf+json': ['.gltf'],
@@ -80,12 +74,12 @@ function uploadSingleFile(
try { try {
resolve(JSON.parse(xhr.responseText)) resolve(JSON.parse(xhr.responseText))
} catch { } catch {
resolve({ success: false, error: `Réponse inattendue (HTTP ${xhr.status})` }) resolve({ success: false, error: `Unexpected response (HTTP ${xhr.status})` })
} }
} }
xhr.onerror = () => resolve({ success: false, error: 'Erreur réseau.' }) xhr.onerror = () => resolve({ success: false, error: 'Network error.' })
xhr.onabort = () => resolve({ success: false, error: 'Annulé.' }) xhr.onabort = () => resolve({ success: false, error: 'Cancelled.' })
xhr.open('POST', '/api/upload') xhr.open('POST', '/api/upload')
xhr.setRequestHeader('x-upload-secret', secret.trim()) xhr.setRequestHeader('x-upload-secret', secret.trim())
@@ -93,9 +87,6 @@ function uploadSingleFile(
}) })
} }
// ─────────────────────────────────────────────
// Composant principal
// ─────────────────────────────────────────────
export default function UploadZone() { export default function UploadZone() {
const [files, setFiles] = useState<FileEntry[]>([]) const [files, setFiles] = useState<FileEntry[]>([])
const [isUploading, setIsUploading] = useState(false) const [isUploading, setIsUploading] = useState(false)
@@ -109,10 +100,9 @@ export default function UploadZone() {
setFiles((prev) => prev.map((f, i) => i === index ? { ...f, ...patch } : f)) setFiles((prev) => prev.map((f, i) => i === index ? { ...f, ...patch } : f))
} }
// ── Upload séquentiel de tous les fichiers ──
const handleUpload = useCallback(async () => { const handleUpload = useCallback(async () => {
if (!secret.trim()) { if (!secret.trim()) {
setGlobalError('Veuillez saisir la clé d\'accès avant d\'uploader.') setGlobalError('Please enter the access key before uploading.')
return return
} }
if (files.length === 0) return if (files.length === 0) return
@@ -144,38 +134,33 @@ export default function UploadZone() {
setIsUploading(false) setIsUploading(false)
}, [files, secret, assetName]) }, [files, secret, assetName])
// ── Annuler le fichier en cours ──
const handleCancel = () => { xhrRef.current?.abort() } const handleCancel = () => { xhrRef.current?.abort() }
// ── Supprimer un fichier de la liste ──
const removeFile = (index: number) => { const removeFile = (index: number) => {
setFiles((prev) => prev.filter((_, i) => i !== index)) setFiles((prev) => prev.filter((_, i) => i !== index))
} }
// ── Reset total ──
const handleReset = () => { const handleReset = () => {
setFiles([]) setFiles([])
setGlobalError(null) setGlobalError(null)
setIsUploading(false) setIsUploading(false)
} }
// ── react-dropzone ──
const onDrop = useCallback((acceptedFiles: File[], rejectedFiles: FileRejection[]) => { const onDrop = useCallback((acceptedFiles: File[], rejectedFiles: FileRejection[]) => {
if (rejectedFiles.length > 0) { if (rejectedFiles.length > 0) {
const codes = rejectedFiles[0].errors.map((e) => e.code).join(', ') const codes = rejectedFiles[0].errors.map((e) => e.code).join(', ')
setGlobalError( setGlobalError(
codes.includes('file-invalid-type') codes.includes('file-invalid-type')
? `Format non supporté. Utilisez : ${ALL_EXTENSIONS.join(', ')}` ? `Unsupported format. Use: ${ALL_EXTENSIONS.join(', ')}`
: codes.includes('file-too-large') : codes.includes('file-too-large')
? 'Fichier trop volumineux (max 2 GB)' ? 'File too large (max 2 GB)'
: `Fichier rejeté : ${codes}` : `File rejected: ${codes}`
) )
return return
} }
setGlobalError(null) setGlobalError(null)
setFiles((prev) => { setFiles((prev) => {
// Dédoublonner par nom
const existingNames = new Set(prev.map((f) => f.file.name)) const existingNames = new Set(prev.map((f) => f.file.name))
const newEntries: FileEntry[] = acceptedFiles const newEntries: FileEntry[] = acceptedFiles
.filter((f) => !existingNames.has(f.name)) .filter((f) => !existingNames.has(f.name))
@@ -195,31 +180,26 @@ export default function UploadZone() {
const allDone = files.length > 0 && files.every((f) => f.status === 'success') const allDone = files.length > 0 && files.every((f) => f.status === 'success')
const hasErrors = files.some((f) => f.status === 'error') const hasErrors = files.some((f) => f.status === 'error')
// ─────────────────────────────────────────────
// Render
// ─────────────────────────────────────────────
return ( return (
<div className="w-full max-w-2xl space-y-4"> <div className="w-full max-w-2xl space-y-4">
{/* Clé d'accès */}
<div className="space-y-1.5"> <div className="space-y-1.5">
<label className="block text-sm font-medium text-gray-700">Clé d&apos;accès</label> <label className="block text-sm font-medium text-gray-300">Access Key</label>
<div className="relative"> <div className="relative">
<input <input
type={secretVisible ? 'text' : 'password'} type={secretVisible ? 'text' : 'password'}
value={secret} value={secret}
onChange={(e) => setSecret(e.target.value)} onChange={(e) => setSecret(e.target.value)}
placeholder="Saisir la clé secrète…" placeholder="Enter secret key..."
disabled={isUploading} disabled={isUploading}
className="w-full bg-white border border-surface-border rounded-xl px-4 py-2.5 pr-12 className="w-full bg-black-800 border border-black-700 rounded-xl px-4 py-2.5 pr-12
text-gray-800 placeholder-gray-300 text-sm shadow-soft text-gray-100 placeholder-gray-500 text-sm
focus:outline-none focus:ring-2 focus:ring-brand-300 focus:border-brand-400 focus:outline-none focus:ring-2 focus:ring-gray-600 focus:border-gray-500
disabled:opacity-50 disabled:cursor-not-allowed transition" disabled:opacity-50 disabled:cursor-not-allowed transition"
/> />
<button <button
type="button" type="button"
onClick={() => setSecretVisible((v) => !v)} onClick={() => setSecretVisible((v) => !v)}
className="absolute right-3 top-1/2 -translate-y-1/2 text-gray-400 hover:text-brand-500 transition" className="absolute right-3 top-1/2 -translate-y-1/2 text-gray-500 hover:text-gray-300 transition"
tabIndex={-1} tabIndex={-1}
> >
{secretVisible ? ( {secretVisible ? (
@@ -236,43 +216,41 @@ export default function UploadZone() {
</div> </div>
</div> </div>
{/* Nom de l'asset */}
<div className="space-y-1.5"> <div className="space-y-1.5">
<label className="block text-sm font-medium text-gray-700"> <label className="block text-sm font-medium text-gray-300">
Nom de l&apos;asset Asset Name
<span className="text-gray-400 font-normal ml-2">— nom commun pour le modèle et la texture</span> <span className="text-gray-500 font-normal ml-2">— common name for model and texture</span>
</label> </label>
<input <input
type="text" type="text"
value={assetName} value={assetName}
onChange={(e) => setAssetName(e.target.value)} onChange={(e) => setAssetName(e.target.value)}
placeholder="ex : clocher, sol_pierre, mur_brique…" placeholder="e.g., tower, stone_floor, brick_wall..."
disabled={isUploading} disabled={isUploading}
className="w-full bg-white border border-surface-border rounded-xl px-4 py-2.5 className="w-full bg-black-800 border border-black-700 rounded-xl px-4 py-2.5
text-gray-800 placeholder-gray-300 text-sm font-mono shadow-soft text-gray-100 placeholder-gray-500 text-sm font-mono
focus:outline-none focus:ring-2 focus:ring-brand-300 focus:border-brand-400 focus:outline-none focus:ring-2 focus:ring-gray-600 focus:border-gray-500
disabled:opacity-50 disabled:cursor-not-allowed transition" disabled:opacity-50 disabled:cursor-not-allowed transition"
/> />
</div> </div>
{/* Dropzone */}
<div <div
{...getRootProps()} {...getRootProps()}
className={` className={`
relative border-2 border-dashed rounded-2xl p-8 text-center cursor-pointer transition-all duration-200 bg-white shadow-soft relative border-2 border-dashed rounded-2xl p-8 text-center cursor-pointer transition-all duration-200 bg-black-800
${isUploading ? 'cursor-not-allowed opacity-60 border-surface-border' : ''} ${isUploading ? 'cursor-not-allowed opacity-60 border-black-700' : ''}
${isDragReject ? 'border-red-400 bg-red-50' : ''} ${isDragReject ? 'border-red-500 bg-red-900/20' : ''}
${isDragActive && !isDragReject ? 'border-brand-400 bg-brand-50 scale-[1.01]' : ''} ${isDragActive && !isDragReject ? 'border-gray-400 bg-black-700 scale-[1.01]' : ''}
${!isDragActive && !isDragReject && !isUploading ${!isDragActive && !isDragReject && !isUploading
? 'border-surface-border hover:border-brand-300 hover:bg-brand-50/40' ? 'border-black-600 hover:border-gray-500 hover:bg-black-700'
: ''} : ''}
`} `}
> >
<input {...getInputProps()} /> <input {...getInputProps()} />
<div className="flex justify-center mb-3"> <div className="flex justify-center mb-3">
<div className={`w-12 h-12 rounded-full flex items-center justify-center transition <div className={`w-12 h-12 rounded-full flex items-center justify-center transition
${isDragActive ? 'bg-brand-200' : 'bg-brand-100'}`}> ${isDragActive ? 'bg-gray-700' : 'bg-black-700'}`}>
<svg className={`w-6 h-6 transition ${isDragActive ? 'text-brand-600' : 'text-brand-500'}`} <svg className={`w-6 h-6 transition ${isDragActive ? 'text-white' : 'text-gray-400'}`}
fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}> fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}>
<path strokeLinecap="round" strokeLinejoin="round" <path strokeLinecap="round" strokeLinejoin="round"
d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" /> d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />
@@ -280,102 +258,96 @@ export default function UploadZone() {
</div> </div>
</div> </div>
{isDragReject ? ( {isDragReject ? (
<p className="text-sm font-medium text-red-500">Format non supporté</p> <p className="text-sm font-medium text-red-400">Unsupported format</p>
) : isDragActive ? ( ) : isDragActive ? (
<p className="text-sm font-medium text-brand-600">Relâchez pour ajouter</p> <p className="text-sm font-medium text-gray-200">Release to add</p>
) : ( ) : (
<> <>
<p className="text-sm font-medium text-gray-600"> <p className="text-sm font-medium text-gray-300">
Glissez vos fichiers ici Drag files here
<span className="text-gray-400 font-normal"> ou cliquez pour parcourir</span> <span className="text-gray-500 font-normal"> or click to browse</span>
</p> </p>
<p className="text-xs text-gray-400 mt-1"> <p className="text-xs text-gray-500 mt-1">
Modèles : .glb, .gltf, .fbx · Textures : .png, .jpg, .webp, .ktx2 Models: .glb, .gltf, .fbx · Textures: .png, .jpg, .webp, .ktx2
</p> </p>
</> </>
)} )}
</div> </div>
{/* Erreur globale */}
{globalError && ( {globalError && (
<p className="text-xs text-red-500 text-center">{globalError}</p> <p className="text-xs text-red-400 text-center">{globalError}</p>
)} )}
{/* Liste des fichiers */}
{files.length > 0 && ( {files.length > 0 && (
<div className="space-y-2"> <div className="space-y-2">
{files.map((entry, i) => { {files.map((entry, i) => {
const type = getFileType(entry.file.name) const type = getFileType(entry.file.name)
return ( return (
<div key={`${entry.file.name}-${i}`} <div key={`${entry.file.name}-${i}`}
className="flex items-center gap-3 bg-white border border-surface-border rounded-xl px-4 py-3 shadow-soft"> className="flex items-center gap-3 bg-black-800 border border-black-700 rounded-xl px-4 py-3">
{/* Icône statut */}
<div className="shrink-0"> <div className="shrink-0">
{entry.status === 'success' ? ( {entry.status === 'success' ? (
<div className="w-8 h-8 rounded-full bg-green-100 flex items-center justify-center"> <div className="w-8 h-8 rounded-full bg-green-900/30 flex items-center justify-center">
<svg className="w-4 h-4 text-green-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2.5}> <svg className="w-4 h-4 text-green-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2.5}>
<path strokeLinecap="round" strokeLinejoin="round" d="M5 13l4 4L19 7" /> <path strokeLinecap="round" strokeLinejoin="round" d="M5 13l4 4L19 7" />
</svg> </svg>
</div> </div>
) : entry.status === 'error' ? ( ) : entry.status === 'error' ? (
<div className="w-8 h-8 rounded-full bg-red-100 flex items-center justify-center"> <div className="w-8 h-8 rounded-full bg-red-900/30 flex items-center justify-center">
<svg className="w-4 h-4 text-red-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2.5}> <svg className="w-4 h-4 text-red-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2.5}>
<path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" /> <path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
</svg> </svg>
</div> </div>
) : entry.status === 'uploading' ? ( ) : entry.status === 'uploading' ? (
<div className="w-8 h-8 rounded-full bg-brand-100 flex items-center justify-center"> <div className="w-8 h-8 rounded-full bg-gray-700 flex items-center justify-center">
<svg className="w-4 h-4 text-brand-500 animate-spin" fill="none" viewBox="0 0 24 24"> <svg className="w-4 h-4 text-gray-300 animate-spin" fill="none" viewBox="0 0 24 24">
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" /> <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" /> <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
</svg> </svg>
</div> </div>
) : ( ) : (
<div className="w-8 h-8 rounded-full bg-surface-muted flex items-center justify-center"> <div className="w-8 h-8 rounded-full bg-black-700 flex items-center justify-center">
<svg className="w-4 h-4 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}> <svg className="w-4 h-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}>
<path strokeLinecap="round" strokeLinejoin="round" d="M19 9l-7 7-7-7" /> <path strokeLinecap="round" strokeLinejoin="round" d="M19 9l-7 7-7-7" />
</svg> </svg>
</div> </div>
)} )}
</div> </div>
{/* Infos fichier */}
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<span className="text-sm text-gray-700 font-mono truncate">{entry.file.name}</span> <span className="text-sm text-gray-200 font-mono truncate">{entry.file.name}</span>
{type && ( {type && (
<span className={`shrink-0 text-xs px-1.5 py-0.5 rounded-full <span className={`shrink-0 text-xs px-1.5 py-0.5 rounded-full
${type === 'model' ? 'bg-brand-100 text-brand-600' : 'bg-rose-100 text-rose-500'}`}> ${type === 'model' ? 'bg-gray-700 text-gray-300' : 'bg-gray-700 text-gray-300'}`}>
{type === 'model' ? '3D' : 'Texture'} {type === 'model' ? '3D' : 'Texture'}
</span> </span>
)} )}
</div> </div>
<div className="flex items-center gap-2 mt-0.5"> <div className="flex items-center gap-2 mt-0.5">
<span className="text-xs text-gray-400">{formatBytes(entry.file.size)}</span> <span className="text-xs text-gray-500">{formatBytes(entry.file.size)}</span>
{entry.status === 'error' && entry.error && ( {entry.status === 'error' && entry.error && (
<span className="text-xs text-red-400 truncate">{entry.error}</span> <span className="text-xs text-red-400 truncate">{entry.error}</span>
)} )}
{entry.status === 'success' && entry.filename && ( {entry.status === 'success' && entry.filename && (
<span className="text-xs text-green-500 font-mono">{entry.filename}</span> <span className="text-xs text-green-400 font-mono">{entry.filename}</span>
)} )}
</div> </div>
{/* Barre de progression individuelle */}
{entry.status === 'uploading' && ( {entry.status === 'uploading' && (
<div className="mt-1.5 w-full h-1 bg-brand-100 rounded-full overflow-hidden"> <div className="mt-1.5 w-full h-1 bg-black-700 rounded-full overflow-hidden">
<div <div
className="h-full bg-gradient-brand rounded-full transition-all duration-200" className="h-full bg-gray-400 rounded-full transition-all duration-200"
style={{ width: `${entry.progress}%` }} style={{ width: `${entry.progress}%` }}
/> />
</div> </div>
)} )}
</div> </div>
{/* Supprimer */}
{entry.status !== 'uploading' && ( {entry.status !== 'uploading' && (
<button <button
onClick={() => removeFile(i)} onClick={() => removeFile(i)}
className="shrink-0 text-gray-300 hover:text-red-400 transition" className="shrink-0 text-gray-600 hover:text-red-400 transition"
> >
<svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}> <svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
<path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" /> <path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
@@ -388,38 +360,39 @@ export default function UploadZone() {
</div> </div>
)} )}
{/* Boutons d'action */}
<div className="flex gap-3"> <div className="flex gap-3">
{!isUploading && files.some((f) => f.status === 'pending' || f.status === 'error') && ( {!isUploading && files.some((f) => f.status === 'pending' || f.status === 'error') && (
<button <button
onClick={handleUpload} onClick={handleUpload}
className="flex-1 bg-gradient-brand hover:opacity-90 text-white font-medium text-sm className="flex-1 bg-white text-black font-medium text-sm
py-2.5 px-6 rounded-xl shadow-soft transition-opacity duration-150 py-2.5 px-6 rounded-xl transition-opacity duration-150
focus:outline-none focus:ring-2 focus:ring-brand-300" hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-gray-400"
> >
Uploader {files.filter(f => f.status !== 'success').length > 1 Upload {files.filter(f => f.status !== 'success').length > 1
? `${files.filter(f => f.status !== 'success').length} fichiers` ? `${files.filter(f => f.status !== 'success').length} files`
: 'le fichier'} &amp; Pousser sur Git : 'file'} & Push to Git
</button> </button>
)} )}
{isUploading && ( {isUploading && (
<button <button
onClick={handleCancel} onClick={handleCancel}
className="flex-1 bg-surface-muted hover:bg-brand-100 text-gray-600 font-medium text-sm className="flex-1 bg-black-700 text-gray-300 font-medium text-sm
py-2.5 px-6 rounded-xl border border-surface-border transition-colors duration-150" py-2.5 px-6 rounded-xl border border-black-600 transition-colors duration-150
hover:bg-black-600"
> >
Annuler le fichier en cours Cancel
</button> </button>
)} )}
{(allDone || hasErrors) && !isUploading && ( {(allDone || hasErrors) && !isUploading && (
<button <button
onClick={handleReset} onClick={handleReset}
className="flex-1 bg-surface-muted hover:bg-brand-100 text-gray-600 font-medium text-sm className="flex-1 bg-black-700 text-gray-300 font-medium text-sm
py-2.5 px-6 rounded-xl border border-surface-border transition-colors duration-150" py-2.5 px-6 rounded-xl border border-black-600 transition-colors duration-150
hover:bg-black-600"
> >
{allDone ? 'Tout effacer' : 'Réessayer'} {allDone ? 'Clear All' : 'Retry'}
</button> </button>
)} )}
</div> </div>
package-lock.json
Generated
+132 -72
View File
@@ -15,13 +15,13 @@
}, },
"devDependencies": { "devDependencies": {
"@types/busboy": "^1.5.4", "@types/busboy": "^1.5.4",
"@types/node": "^20.14.0", "@types/node": "20.19.37",
"@types/react": "^18.3.0", "@types/react": "18.3.28",
"@types/react-dom": "^18.3.0", "@types/react-dom": "^18.3.0",
"autoprefixer": "^10.4.19", "autoprefixer": "^10.4.19",
"postcss": "^8.4.38", "postcss": "^8.4.38",
"tailwindcss": "^3.4.4", "tailwindcss": "^3.4.4",
"typescript": "^5.4.5" "typescript": "5.9.3"
} }
}, },
"node_modules/@alloc/quick-lru": { "node_modules/@alloc/quick-lru": {
@@ -38,9 +38,9 @@
} }
}, },
"node_modules/@emnapi/runtime": { "node_modules/@emnapi/runtime": {
"version": "1.9.0", "version": "1.9.2",
"resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.9.0.tgz", "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.9.2.tgz",
"integrity": "sha512-QN75eB0IH2ywSpRpNddCRfQIhmJYBCJ1x5Lb3IscKAL8bMnVAKnRg8dCoXbHzVLLH7P38N2Z3mtulB7W0J0FKw==", "integrity": "sha512-3U4+MIWHImeyu1wnmVygh5WlgfYDtyf0k8AbLhMFxOipihf6nrWC4syIm/SwEeec0mNSafiiNnMJwbza/Is6Lw==",
"license": "MIT", "license": "MIT",
"optional": true, "optional": true,
"dependencies": { "dependencies": {
@@ -140,6 +140,9 @@
"cpu": [ "cpu": [
"arm" "arm"
], ],
"libc": [
"glibc"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -156,6 +159,9 @@
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
"libc": [
"glibc"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -172,6 +178,9 @@
"cpu": [ "cpu": [
"ppc64" "ppc64"
], ],
"libc": [
"glibc"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -188,6 +197,9 @@
"cpu": [ "cpu": [
"riscv64" "riscv64"
], ],
"libc": [
"glibc"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -204,6 +216,9 @@
"cpu": [ "cpu": [
"s390x" "s390x"
], ],
"libc": [
"glibc"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -220,6 +235,9 @@
"cpu": [ "cpu": [
"x64" "x64"
], ],
"libc": [
"glibc"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -236,6 +254,9 @@
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
"libc": [
"musl"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -252,6 +273,9 @@
"cpu": [ "cpu": [
"x64" "x64"
], ],
"libc": [
"musl"
],
"license": "LGPL-3.0-or-later", "license": "LGPL-3.0-or-later",
"optional": true, "optional": true,
"os": [ "os": [
@@ -268,6 +292,9 @@
"cpu": [ "cpu": [
"arm" "arm"
], ],
"libc": [
"glibc"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -290,6 +317,9 @@
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
"libc": [
"glibc"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -312,6 +342,9 @@
"cpu": [ "cpu": [
"ppc64" "ppc64"
], ],
"libc": [
"glibc"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -334,6 +367,9 @@
"cpu": [ "cpu": [
"riscv64" "riscv64"
], ],
"libc": [
"glibc"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -356,6 +392,9 @@
"cpu": [ "cpu": [
"s390x" "s390x"
], ],
"libc": [
"glibc"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -378,6 +417,9 @@
"cpu": [ "cpu": [
"x64" "x64"
], ],
"libc": [
"glibc"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -400,6 +442,9 @@
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
"libc": [
"musl"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -422,6 +467,9 @@
"cpu": [ "cpu": [
"x64" "x64"
], ],
"libc": [
"musl"
],
"license": "Apache-2.0", "license": "Apache-2.0",
"optional": true, "optional": true,
"os": [ "os": [
@@ -553,15 +601,15 @@
} }
}, },
"node_modules/@next/env": { "node_modules/@next/env": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/env/-/env-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/env/-/env-16.2.2.tgz",
"integrity": "sha512-rJJbIdJB/RQr2F1nylZr/PJzamvNNhfr3brdKP6s/GW850jbtR70QlSfFselvIBbcPUOlQwBakexjFzqLzF6pg==", "integrity": "sha512-LqSGz5+xGk9EL/iBDr2yo/CgNQV6cFsNhRR2xhSXYh7B/hb4nePCxlmDvGEKG30NMHDFf0raqSyOZiQrO7BkHQ==",
"license": "MIT" "license": "MIT"
}, },
"node_modules/@next/swc-darwin-arm64": { "node_modules/@next/swc-darwin-arm64": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-16.2.2.tgz",
"integrity": "sha512-b2wWIE8sABdyafc4IM8r5Y/dS6kD80JRtOGrUiKTsACFQfWWgUQ2NwoUX1yjFMXVsAwcQeNpnucF2ZrujsBBPg==", "integrity": "sha512-B92G3ulrwmkDSEJEp9+XzGLex5wC1knrmCSIylyVeiAtCIfvEJYiN3v5kXPlYt5R4RFlsfO/v++aKV63Acrugg==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -575,9 +623,9 @@
} }
}, },
"node_modules/@next/swc-darwin-x64": { "node_modules/@next/swc-darwin-x64": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-16.2.2.tgz",
"integrity": "sha512-zcnVaaZulS1WL0Ss38R5Q6D2gz7MtBu8GZLPfK+73D/hp4GFMrC2sudLky1QibfV7h6RJBJs/gOFvYP0X7UVlQ==", "integrity": "sha512-7ZwSgNKJNQiwW0CKhNm9B1WS2L1Olc4B2XY0hPYCAL3epFnugMhuw5TMWzMilQ3QCZcCHoYm9NGWTHbr5REFxw==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -591,12 +639,15 @@
} }
}, },
"node_modules/@next/swc-linux-arm64-gnu": { "node_modules/@next/swc-linux-arm64-gnu": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-16.2.2.tgz",
"integrity": "sha512-2ant89Lux/Q3VyC8vNVg7uBaFVP9SwoK2jJOOR0L8TQnX8CAYnh4uctAScy2Hwj2dgjVHqHLORQZJ2wH6VxhSQ==", "integrity": "sha512-c3m8kBHMziMgo2fICOP/cd/5YlrxDU5YYjAJeQLyFsCqVF8xjOTH/QYG4a2u48CvvZZSj1eHQfBCbyh7kBr30Q==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
"libc": [
"glibc"
],
"license": "MIT", "license": "MIT",
"optional": true, "optional": true,
"os": [ "os": [
@@ -607,12 +658,15 @@
} }
}, },
"node_modules/@next/swc-linux-arm64-musl": { "node_modules/@next/swc-linux-arm64-musl": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-16.2.2.tgz",
"integrity": "sha512-uufcze7LYv0FQg9GnNeZ3/whYfo+1Q3HnQpm16o6Uyi0OVzLlk2ZWoY7j07KADZFY8qwDbsmFnMQP3p3+Ftprw==", "integrity": "sha512-VKLuscm0P/mIfzt+SDdn2+8TNNJ7f0qfEkA+az7OqQbjzKdBxAHs0UvuiVoCtbwX+dqMEL9U54b5wQ/aN3dHeg==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
"libc": [
"musl"
],
"license": "MIT", "license": "MIT",
"optional": true, "optional": true,
"os": [ "os": [
@@ -623,12 +677,15 @@
} }
}, },
"node_modules/@next/swc-linux-x64-gnu": { "node_modules/@next/swc-linux-x64-gnu": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-16.2.2.tgz",
"integrity": "sha512-KWVf2gxYvHtvuT+c4MBOGxuse5TD7DsMFYSxVxRBnOzok/xryNeQSjXgxSv9QpIVlaGzEn/pIuI6Koosx8CGWA==", "integrity": "sha512-kU3OPHJq6sBUjOk7wc5zJ7/lipn8yGldMoAv4z67j6ov6Xo/JvzA7L7LCsyzzsXmgLEhk3Qkpwqaq/1+XpNR3g==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
"libc": [
"glibc"
],
"license": "MIT", "license": "MIT",
"optional": true, "optional": true,
"os": [ "os": [
@@ -639,12 +696,15 @@
} }
}, },
"node_modules/@next/swc-linux-x64-musl": { "node_modules/@next/swc-linux-x64-musl": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-16.2.2.tgz",
"integrity": "sha512-HguhaGwsGr1YAGs68uRKc4aGWxLET+NevJskOcCAwXbwj0fYX0RgZW2gsOCzr9S11CSQPIkxmoSbuVaBp4Z3dA==", "integrity": "sha512-CKXRILyErMtUftp+coGcZ38ZwE/Aqq45VMCcRLr2I4OXKrgxIBDXHnBgeX/UMil0S09i2JXaDL3Q+TN8D/cKmg==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
"libc": [
"musl"
],
"license": "MIT", "license": "MIT",
"optional": true, "optional": true,
"os": [ "os": [
@@ -655,9 +715,9 @@
} }
}, },
"node_modules/@next/swc-win32-arm64-msvc": { "node_modules/@next/swc-win32-arm64-msvc": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-16.2.2.tgz",
"integrity": "sha512-S0n3KrDJokKTeFyM/vGGGR8+pCmXYrjNTk2ZozOL1C/JFdfUIL9O1ATaJOl5r2POe56iRChbsszrjMAdWSv7kQ==", "integrity": "sha512-sS/jSk5VUoShUqINJFvNjVT7JfR5ORYj/+/ZpOYbbIohv/lQfduWnGAycq2wlknbOql2xOR0DoV0s6Xfcy49+g==",
"cpu": [ "cpu": [
"arm64" "arm64"
], ],
@@ -671,9 +731,9 @@
} }
}, },
"node_modules/@next/swc-win32-x64-msvc": { "node_modules/@next/swc-win32-x64-msvc": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.1.7.tgz", "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-16.2.2.tgz",
"integrity": "sha512-mwgtg8CNZGYm06LeEd+bNnOUfwOyNem/rOiP14Lsz+AnUY92Zq/LXwtebtUiaeVkhbroRCQ0c8GlR4UT1U+0yg==", "integrity": "sha512-aHaKceJgdySReT7qeck5oShucxWRiiEuwCGK8HHALe6yZga8uyFpLkPgaRw3kkF04U7ROogL/suYCNt/+CuXGA==",
"cpu": [ "cpu": [
"x64" "x64"
], ],
@@ -856,9 +916,9 @@
} }
}, },
"node_modules/baseline-browser-mapping": { "node_modules/baseline-browser-mapping": {
"version": "2.10.8", "version": "2.10.13",
"resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.8.tgz", "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.13.tgz",
"integrity": "sha512-PCLz/LXGBsNTErbtB6i5u4eLpHeMfi93aUv5duMmj6caNu6IphS4q6UevDnL36sZQv9lrP11dbPKGMaXPwMKfQ==", "integrity": "sha512-BL2sTuHOdy0YT1lYieUxTw/QMtPBC3pmlJC6xk8BBYVv6vcw3SGdKemQ+Xsx9ik2F/lYDO9tqsFQH1r9PFuHKw==",
"license": "Apache-2.0", "license": "Apache-2.0",
"bin": { "bin": {
"baseline-browser-mapping": "dist/cli.cjs" "baseline-browser-mapping": "dist/cli.cjs"
@@ -894,9 +954,9 @@
} }
}, },
"node_modules/browserslist": { "node_modules/browserslist": {
"version": "4.28.1", "version": "4.28.2",
"resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.1.tgz", "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz",
"integrity": "sha512-ZC5Bd0LgJXgwGqUknZY/vkUQ04r8NXnJZ3yYi4vDmSiZmC/pdSN0NbNRPxZpbtO4uAfDUAFffO8IZoM3Gj8IkA==", "integrity": "sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==",
"dev": true, "dev": true,
"funding": [ "funding": [
{ {
@@ -914,11 +974,11 @@
], ],
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"baseline-browser-mapping": "^2.9.0", "baseline-browser-mapping": "^2.10.12",
"caniuse-lite": "^1.0.30001759", "caniuse-lite": "^1.0.30001782",
"electron-to-chromium": "^1.5.263", "electron-to-chromium": "^1.5.328",
"node-releases": "^2.0.27", "node-releases": "^2.0.36",
"update-browserslist-db": "^1.2.0" "update-browserslist-db": "^1.2.3"
}, },
"bin": { "bin": {
"browserslist": "cli.js" "browserslist": "cli.js"
@@ -938,9 +998,9 @@
} }
}, },
"node_modules/caniuse-lite": { "node_modules/caniuse-lite": {
"version": "1.0.30001780", "version": "1.0.30001784",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001780.tgz", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001784.tgz",
"integrity": "sha512-llngX0E7nQci5BPJDqoZSbuZ5Bcs9F5db7EtgfwBerX9XGtkkiO4NwfDDIRzHTTwcYC8vC7bmeUEPGrKlR/TkQ==", "integrity": "sha512-WU346nBTklUV9YfUl60fqRbU5ZqyXlqvo1SgigE1OAXK5bFL8LL9q1K7aap3N739l4BvNqnkm3YrGHiY9sfUQw==",
"funding": [ "funding": [
{ {
"type": "opencollective", "type": "opencollective",
@@ -1056,9 +1116,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/electron-to-chromium": { "node_modules/electron-to-chromium": {
"version": "1.5.321", "version": "1.5.331",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.321.tgz", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.331.tgz",
"integrity": "sha512-L2C7Q279W2D/J4PLZLk7sebOILDSWos7bMsMNN06rK482umHUrh/3lM8G7IlHFOYip2oAg5nha1rCMxr/rs6ZQ==", "integrity": "sha512-IbxXrsTlD3hRodkLnbxAPP4OuJYdWCeM3IOdT+CpcMoIwIoDfCmRpEtSPfwBXxVkg9xmBeY7Lz2Eo2TDn/HC3Q==",
"dev": true, "dev": true,
"license": "ISC" "license": "ISC"
}, },
@@ -1367,12 +1427,12 @@
} }
}, },
"node_modules/next": { "node_modules/next": {
"version": "16.1.7", "version": "16.2.2",
"resolved": "https://registry.npmjs.org/next/-/next-16.1.7.tgz", "resolved": "https://registry.npmjs.org/next/-/next-16.2.2.tgz",
"integrity": "sha512-WM0L7WrSvKwoLegLYr6V+mz+RIofqQgVAfHhMp9a88ms0cFX8iX9ew+snpWlSBwpkURJOUdvCEt3uLl3NNzvWg==", "integrity": "sha512-i6AJdyVa4oQjyvX/6GeER8dpY/xlIV+4NMv/svykcLtURJSy/WzDnnUk/TM4d0uewFHK7xSQz4TbIwPgjky+3A==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@next/env": "16.1.7", "@next/env": "16.2.2",
"@swc/helpers": "0.5.15", "@swc/helpers": "0.5.15",
"baseline-browser-mapping": "^2.9.19", "baseline-browser-mapping": "^2.9.19",
"caniuse-lite": "^1.0.30001579", "caniuse-lite": "^1.0.30001579",
@@ -1386,15 +1446,15 @@
"node": ">=20.9.0" "node": ">=20.9.0"
}, },
"optionalDependencies": { "optionalDependencies": {
"@next/swc-darwin-arm64": "16.1.7", "@next/swc-darwin-arm64": "16.2.2",
"@next/swc-darwin-x64": "16.1.7", "@next/swc-darwin-x64": "16.2.2",
"@next/swc-linux-arm64-gnu": "16.1.7", "@next/swc-linux-arm64-gnu": "16.2.2",
"@next/swc-linux-arm64-musl": "16.1.7", "@next/swc-linux-arm64-musl": "16.2.2",
"@next/swc-linux-x64-gnu": "16.1.7", "@next/swc-linux-x64-gnu": "16.2.2",
"@next/swc-linux-x64-musl": "16.1.7", "@next/swc-linux-x64-musl": "16.2.2",
"@next/swc-win32-arm64-msvc": "16.1.7", "@next/swc-win32-arm64-msvc": "16.2.2",
"@next/swc-win32-x64-msvc": "16.1.7", "@next/swc-win32-x64-msvc": "16.2.2",
"sharp": "^0.34.4" "sharp": "^0.34.5"
}, },
"peerDependencies": { "peerDependencies": {
"@opentelemetry/api": "^1.1.0", "@opentelemetry/api": "^1.1.0",
@@ -1448,9 +1508,9 @@
} }
}, },
"node_modules/node-releases": { "node_modules/node-releases": {
"version": "2.0.36", "version": "2.0.37",
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.36.tgz", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.37.tgz",
"integrity": "sha512-TdC8FSgHz8Mwtw9g5L4gR/Sh9XhSP/0DEkQxfEFXOpiul5IiHgHan2VhYYb6agDSfp4KuvltmGApc8HMgUrIkA==", "integrity": "sha512-1h5gKZCF+pO/o3Iqt5Jp7wc9rH3eJJ0+nh/CIoiRwjRxde/hAHyLPXYN4V3CqKAbiZPSeJFSWHmJsbkicta0Eg==",
"dev": true, "dev": true,
"license": "MIT" "license": "MIT"
}, },
@@ -1497,9 +1557,9 @@
"license": "ISC" "license": "ISC"
}, },
"node_modules/picomatch": { "node_modules/picomatch": {
"version": "2.3.1", "version": "2.3.2",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"engines": { "engines": {
@@ -2083,9 +2143,9 @@
} }
}, },
"node_modules/tinyglobby/node_modules/picomatch": { "node_modules/tinyglobby/node_modules/picomatch": {
"version": "4.0.3", "version": "4.0.4",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"engines": { "engines": {
package.json
+3 -3
View File
@@ -16,12 +16,12 @@
}, },
"devDependencies": { "devDependencies": {
"@types/busboy": "^1.5.4", "@types/busboy": "^1.5.4",
"@types/node": "^20.14.0", "@types/node": "20.19.37",
"@types/react": "^18.3.0", "@types/react": "18.3.28",
"@types/react-dom": "^18.3.0", "@types/react-dom": "^18.3.0",
"autoprefixer": "^10.4.19", "autoprefixer": "^10.4.19",
"postcss": "^8.4.38", "postcss": "^8.4.38",
"tailwindcss": "^3.4.4", "tailwindcss": "^3.4.4",
"typescript": "^5.4.5" "typescript": "5.9.3"
} }
} }
tailwind.config.ts
+24 -23
View File
@@ -9,28 +9,29 @@ const config: Config = {
theme: { theme: {
extend: { extend: {
colors: { colors: {
brand: { black: {
50: '#FAF5FF', 50: '#F7F7F7',
100: '#EDE9FE', 100: '#E5E5E5',
200: '#DDD6FE', 200: '#CCCCCC',
300: '#C4B5FD', 300: '#999999',
400: '#A78BFA', 400: '#666666',
500: '#7C5CFC', // violet principal (image) 500: '#333333',
600: '#6D28D9', 600: '#1A1A1A',
700: '#5B21B6', 700: '#0D0D0D',
900: '#2E1065', 800: '#050505',
900: '#000000',
}, },
// Rose/magenta (dégradé image) gray: {
rose: { 50: '#FAFAFA',
300: '#FDA4C4', 100: '#F5F5F5',
400: '#F472B6', 200: '#E5E5E5',
500: '#EC4899', 300: '#D4D4D4',
}, 400: '#A3A3A3',
surface: { 500: '#737373',
DEFAULT: '#FFFFFF', 600: '#525252',
soft: '#F9F5FF', // fond global lavande très clair 700: '#404040',
muted: '#F3EEFF', // fond carte/panel 800: '#262626',
border: '#E5D9FD', // bordure douce 900: '#171717',
}, },
}, },
fontFamily: { fontFamily: {
@@ -38,8 +39,8 @@ const config: Config = {
mono: ['JetBrains Mono', 'Fira Code', 'monospace'], mono: ['JetBrains Mono', 'Fira Code', 'monospace'],
}, },
boxShadow: { boxShadow: {
soft: '0 2px 16px 0 rgba(124, 92, 252, 0.08)', soft: '0 2px 16px 0 rgba(0, 0, 0, 0.06)',
card: '0 4px 24px 0 rgba(124, 92, 252, 0.10)', card: '0 4px 24px 0 rgba(0, 0, 0, 0.08)',
}, },
}, },
}, },
tsconfig.json
+1 -1
View File
@@ -14,7 +14,7 @@
"moduleResolution": "bundler", "moduleResolution": "bundler",
"resolveJsonModule": true, "resolveJsonModule": true,
"isolatedModules": true, "isolatedModules": true,
"jsx": "react-jsx", "jsx": "preserve",
"incremental": true, "incremental": true,
"plugins": [ "plugins": [
{ {