From a9600555329b0e3e1e50d64ada26bb618513fd4d Mon Sep 17 00:00:00 2001
From: yveskalume <yvkalume@gmail.com>
Date: Thu, 8 Jan 2026 09:51:41 +0200
Subject: [PATCH] feat: update file import/export to use .yvsnap extension
 instead of .json

---
 src/App.tsx                   | 4 ++--
 src/components/MainScreen.tsx | 4 ++--
 src/components/TopBar.tsx     | 6 +++---
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 432a350..44c670f 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -38,7 +38,7 @@ function App() {
   const handleImportFile = useCallback(() => {
     const input = document.createElement('input');
     input.type = 'file';
-    input.accept = '.json';
+    input.accept = '.yvsnap';
     input.onchange = (e) => {
       const file = (e.target as HTMLInputElement).files?.[0];
       if (file) {
@@ -64,7 +64,7 @@ function App() {
     const blob = new Blob([json], { type: 'application/json' });
     const url = URL.createObjectURL(blob);
     const link = document.createElement('a');
-    link.download = `${snap.meta.title || 'canvas'}.json`;
+    link.download = `${snap.meta.title || 'canvas'}.yvsnap`;
     link.href = url;
     link.click();
     URL.revokeObjectURL(url);
diff --git a/src/components/MainScreen.tsx b/src/components/MainScreen.tsx
index 15d834d..6f17156 100644
--- a/src/components/MainScreen.tsx
+++ b/src/components/MainScreen.tsx
@@ -33,7 +33,7 @@ export default function MainScreen({ onOpenEditor }: MainScreenProps) {
   const handleImportFile = () => {
     const input = document.createElement('input');
     input.type = 'file';
-    input.accept = '.json';
+    input.accept = '.yvsnap';
     input.onchange = (e) => {
       const file = (e.target as HTMLInputElement).files?.[0];
       if (file) {
@@ -101,7 +101,7 @@ export default function MainScreen({ onOpenEditor }: MainScreenProps) {
                 <FileText className="w-6 h-6 text-neutral-400 group-hover:text-blue-400" />
               </div>
               <h3 className="font-medium mb-1">Import File</h3>
-              <p className="text-sm text-neutral-500">Open an existing .json project file</p>
+              <p className="text-sm text-neutral-500">Open an existing .yvsnap project file</p>
               <ChevronRight className="absolute right-4 top-1/2 -translate-y-1/2 w-5 h-5 text-neutral-600 group-hover:text-blue-400 opacity-0 group-hover:opacity-100 transition-all" />
             </button>
 
diff --git a/src/components/TopBar.tsx b/src/components/TopBar.tsx
index bc4ffa9..35d9534 100644
--- a/src/components/TopBar.tsx
+++ b/src/components/TopBar.tsx
@@ -88,7 +88,7 @@ const TopBar: React.FC<TopBarProps> = ({ stageRef, onGoHome }) => {
     const blob = new Blob([json], { type: 'application/json' });
     const url = URL.createObjectURL(blob);
     const link = document.createElement('a');
-    link.download = `${snap.meta.title || 'canvas'}.json`;
+    link.download = `${snap.meta.title || 'canvas'}.yvsnap`;
     link.href = url;
     link.click();
     URL.revokeObjectURL(url);
@@ -101,7 +101,7 @@ const TopBar: React.FC<TopBarProps> = ({ stageRef, onGoHome }) => {
   const handleImportJSON = useCallback(() => {
     const input = document.createElement('input');
     input.type = 'file';
-    input.accept = '.json';
+    input.accept = '.yvsnap';
     input.onchange = (e) => {
       const file = (e.target as HTMLInputElement).files?.[0];
       if (file) {
@@ -324,7 +324,7 @@ const TopBar: React.FC<TopBarProps> = ({ stageRef, onGoHome }) => {
                       </div>
                       <div className="flex flex-col items-start gap-0.5">
                         <span className="text-sm font-medium text-neutral-200 group-hover:text-white transition-colors">Save Project</span>
-                        <span className="text-[10px] text-neutral-500">Edit later (.json)</span>
+                        <span className="text-[10px] text-neutral-500">Edit later (.yvsnap)</span>
                       </div>
                     </div>
                   </button>