Update src/addons/addons/save-to-google/userscript.js

src/addons/addons/save-to-google/userscript.js

@@ -1,307 +1,402 @@
 import SB3Downloader from "/src/containers/sb3-downloader.jsx";
 import { getProjectFilename } from '/src/containers/sb3-downloader.jsx';
+
+// getProjectThumbnail関数を追加
+const getProjectThumbnail = () => new Promise(resolve => {
+    window.vm.renderer.requestSnapshot(uri => {
+        resolve(uri);
+    });
+});
+
 export default async ({ addon, console, msg }) => {
-  const CLIENT_ID = "1033286471224-n9mv8l869fqikubj2e8q92n8ige3qr6r.apps.googleusercontent.com";
-  const REDIRECT_URI = "https://soiz1-penguin-upload.hf.space/close2";
-  const SCOPES = "https://www.googleapis.com/auth/drive.file";
-  const PROXY_URL = "https://soiz1-drive-proxy.hf.space/?file_id=";
-  const SHORT_URL = "https://s4.rf.gd/";
-
-  let accessToken = null;
-
-  while (true) {
-    const targetElem = await addon.tab.waitForElement(
-      'div[class*="menu-bar_file-group"] > div:last-child:not(.sa-record)',
-      { markAsSeen: true }
-    );
-
-    if (!document.querySelector('.sa-custom-modal-button')) {
-      const button = document.createElement("div");
-      button.className = "sa-custom-modal-button " + targetElem.className;
-      button.textContent = "保存";
-      button.style.cursor = "pointer";
-
-      button.addEventListener("click", () => {
-        showMainModal(addon);
-      });
-
-      targetElem.parentElement.appendChild(button);
-    }
-  }
-
-  function showMainModal(addon) {
-    const modal = addon.tab.createModal("Googleドライブに保存", { isOpen: true, useEditorClasses: true });
-    
-    modal.content.innerHTML = `
-      <div style="padding: 1rem;">
-        <h1>Googleドライブに接続</h1>
-        <p>Googleでログインして、プロジェクトを保存または更新します。</p>
-        <button id="google-login-button" class="button">Googleでログイン</button>
-        <div id="file-list-container" style="margin-top: 1rem; display: none;">
-          <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
-            <h2 style="margin: 0;">プロジェクト: <span id="project-title" style="cursor: pointer; border-bottom: 1px dashed #000;">${window.vm.runtime.projectName || "無題"}</span></h2>
-            <button id="new-file-button" class="button">新規保存</button>
-          </div>
-          <div id="file-list" style="max-height: 300px; overflow-y: auto; border: 1px solid #ddd; padding: 0.5rem;"></div>
-        </div>
-      </div>
-    `;
-
-    const loginButton = modal.content.querySelector("#google-login-button");
-    const fileListContainer = modal.content.querySelector("#file-list-container");
-    const fileList = modal.content.querySelector("#file-list");
-    const newFileButton = modal.content.querySelector("#new-file-button");
-    const projectTitle = modal.content.querySelector("#project-title");
-
-    // プロジェクトタイトルの編集機能
-    if (projectTitle) {
-      projectTitle.addEventListener("dblclick", () => {
-        const currentName = projectTitle.textContent;
-        const input = document.createElement("input");
-        input.type = "text";
-        input.value = currentName;
-        input.style.width = "200px";
-        
-        projectTitle.replaceWith(input);
-        input.focus();
-
-        const handleBlur = () => {
-          const newName = input.value.trim() || "無題";
-          window.vm.runtime.projectName = newName;
-          projectTitle.textContent = newName;
-          input.replaceWith(projectTitle);
-        };
-
-        input.addEventListener("blur", handleBlur);
-        input.addEventListener("keypress", (e) => {
-          if (e.key === "Enter") {
-            handleBlur();
-          }
-        });
-      });
+    const CLIENT_ID = "1033286471224-n9mv8l869fqikubj2e8q92n8ige3qr6r.apps.googleusercontent.com";
+    const REDIRECT_URI = "https://soiz1-penguin-upload.hf.space/close2";
+    const SCOPES = "https://www.googleapis.com/auth/drive.file";
+    const PROXY_URL = "https://soiz1-drive-proxy.hf.space/?file_id=";
+    const SHORT_URL = "https://s4.rf.gd/";
+
+    let accessToken = null;
+
+    while (true) {
+        const targetElem = await addon.tab.waitForElement(
+            'div[class*="menu-bar_file-group"] > div:last-child:not(.sa-record)',
+            { markAsSeen: true }
+        );
+
+        if (!document.querySelector('.sa-custom-modal-button')) {
+            const button = document.createElement("div");
+            button.className = "sa-custom-modal-button " + targetElem.className;
+            button.textContent = "保存";
+            button.style.cursor = "pointer";
+
+            button.addEventListener("click", () => {
+                showMainModal(addon);
+            });
+
+            targetElem.parentElement.appendChild(button);
+        }
     }
 
-    if (loginButton) {
-      loginButton.addEventListener("click", () => {
-        const messageListener = (event) => {
-          if (event.origin === "https://soiz1-penguin-upload.hf.space" && event.data.token) {
-            window.removeEventListener("message", messageListener);
-            accessToken = event.data.token;
-            
-            loginButton.style.display = "none";
-            
-            fetchDriveFiles(accessToken)
-              .then(files => {
-                displayFileList(files, accessToken, modal, addon);
-                fileListContainer.style.display = "block";
-              })
-              .catch(error => {
-                console.error("ファイル一覧取得エラー:", error);
-                showAlert(addon, "error", "ファイル一覧の取得に失敗しました");
-              });
-          }
-        };
-        window.addEventListener("message", messageListener);
-
-        const authUrl = `https://accounts.google.com/o/oauth2/auth?` +
-          `client_id=${CLIENT_ID}` +
-          `&redirect_uri=${encodeURIComponent(REDIRECT_URI)}` +
-          `&response_type=token` +
-          `&scope=${encodeURIComponent(SCOPES)}`;
+    function showMainModal(addon) {
+        const modal = addon.tab.createModal("Googleドライブに保存", { isOpen: true, useEditorClasses: true });
         
-        window.open(authUrl, "_blank", "width=500,height=600");
-      });
-    }
+        modal.content.innerHTML = `
+            <div style="padding: 1rem;">
+                <h1>Googleドライブに接続</h1>
+                <p>Googleでログインして、プロジェクトを保存または更新します。</p>
+                <button id="google-login-button" class="button">Googleでログイン</button>
+                <div id="file-list-container" style="margin-top: 1rem; display: none;">
+                    <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
+                        <h2 style="margin: 0;">プロジェクト: <span id="project-title" style="cursor: pointer; border-bottom: 1px dashed #000;">${window.vm.runtime.projectName || "無題"}</span></h2>
+                        <button id="new-file-button" class="button">新規保存</button>
+                    </div>
+                    <div id="file-list" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1rem; margin-top: 1rem;"></div>
+                </div>
+            </div>
+        `;
+
+        const loginButton = modal.content.querySelector("#google-login-button");
+        const fileListContainer = modal.content.querySelector("#file-list-container");
+        const fileList = modal.content.querySelector("#file-list");
+        const newFileButton = modal.content.querySelector("#new-file-button");
+        const projectTitle = modal.content.querySelector("#project-title");
+
+        // プロジェクトタイトルの編集機能
+        if (projectTitle) {
+            projectTitle.addEventListener("dblclick", () => {
+                const currentName = projectTitle.textContent;
+                const input = document.createElement("input");
+                input.type = "text";
+                input.value = currentName;
+                input.style.width = "200px";
+                
+                projectTitle.replaceWith(input);
+                input.focus();
+
+                const handleBlur = () => {
+                    const newName = input.value.trim() || "無題";
+                    window.vm.runtime.projectName = newName;
+                    projectTitle.textContent = newName;
+                    input.replaceWith(projectTitle);
+                };
+
+                input.addEventListener("blur", handleBlur);
+                input.addEventListener("keypress", (e) => {
+                    if (e.key === "Enter") {
+                        handleBlur();
+                    }
+                });
+            });
+        }
+
+        if (loginButton) {
+            loginButton.addEventListener("click", () => {
+                const messageListener = (event) => {
+                    if (event.origin === "https://soiz1-penguin-upload.hf.space" && event.data.token) {
+                        window.removeEventListener("message", messageListener);
+                        accessToken = event.data.token;
+                        
+                        loginButton.style.display = "none";
+                        
+                        fetchDriveFiles(accessToken)
+                            .then(files => {
+                                displayFileList(files, accessToken, modal, addon);
+                                fileListContainer.style.display = "block";
+                            })
+                            .catch(error => {
+                                console.error("ファイル一覧取得エラー:", error);
+                                showAlert(addon, "error", "ファイル一覧の取得に失敗しました");
+                            });
+                    }
+                };
+                window.addEventListener("message", messageListener);
+
+                const authUrl = `https://accounts.google.com/o/oauth2/auth?` +
+                    `client_id=${CLIENT_ID}` +
+                    `&redirect_uri=${encodeURIComponent(REDIRECT_URI)}` +
+                    `&response_type=token` +
+                    `&scope=${encodeURIComponent(SCOPES)}`;
+                
+                window.open(authUrl, "_blank", "width=500,height=600");
+            });
+        }
+
+        if (newFileButton) {
+            newFileButton.addEventListener("click", () => {
+                saveToGoogleDrive(null, null, modal.remove, addon)
+                    .catch(error => {
+                        console.error("新規保存エラー:", error);
+                        showAlert(addon, "error", "新規保存に失敗しました");
+                    });
+            });
+        }
 
-    if (newFileButton) {
-      newFileButton.addEventListener("click", () => {
-        saveToGoogleDrive(null, null, modal.remove, addon)
-          .catch(error => {
-            console.error("新規保存エラー:", error);
-            showAlert(addon, "error", "新規保存に失敗しました");
-          });
-      });
+        modal.backdrop.addEventListener("click", modal.remove);
+        modal.closeButton.addEventListener("click", modal.remove);
     }
 
-    modal.backdrop.addEventListener("click", modal.remove);
-    modal.closeButton.addEventListener("click", modal.remove);
-  }
+    async function fetchDriveFiles(accessToken) {
+        const response = await fetch("https://www.googleapis.com/drive/v3/files?q=mimeType='application/x-scratch'", {
+            headers: {
+                Authorization: `Bearer ${accessToken}`,
+            },
+        });
 
-  async function fetchDriveFiles(accessToken) {
-    const response = await fetch("https://www.googleapis.com/drive/v3/files?q=mimeType='application/x-scratch'", {
-      headers: {
-        Authorization: `Bearer ${accessToken}`,
-      },
-    });
+        if (!response.ok) {
+            throw new Error(await response.text());
+        }
 
-    if (!response.ok) {
-      throw new Error(await response.text());
+        const data = await response.json();
+        return data.files || [];
     }
 
-    const data = await response.json();
-    return data.files || [];
-  }
+    async function displayFileList(files, accessToken, modal, addon) {
+        const fileList = modal.content.querySelector("#file-list");
+        fileList.innerHTML = "";
 
-  function displayFileList(files, accessToken, modal, addon) {
-    const fileList = modal.content.querySelector("#file-list");
-    fileList.innerHTML = "";
+        if (files.length === 0) {
+            fileList.innerHTML = "<p>保存されたファイルが見つかりません</p>";
+            return;
+        }
 
-    if (files.length === 0) {
-      fileList.innerHTML = "<p>保存されたファイルが見つかりません</p>";
-      return;
-    }
+        for (const file of files) {
+            const fileItem = document.createElement("div");
+            fileItem.style.border = "1px solid #ddd";
+            fileItem.style.borderRadius = "8px";
+            fileItem.style.padding = "1rem";
+            fileItem.style.display = "flex";
+            fileItem.style.flexDirection = "column";
+            fileItem.style.gap = "0.5rem";
+
+            // サムネイル画像を取得して表示
+            try {
+                const thumbnailUrl = await getThumbnailForFile(file.id, accessToken);
+                if (thumbnailUrl) {
+                    const thumbnail = document.createElement("img");
+                    thumbnail.src = thumbnailUrl;
+                    thumbnail.style.width = "100%";
+                    thumbnail.style.height = "auto";
+                    thumbnail.style.borderRadius = "4px";
+                    thumbnail.style.objectFit = "cover";
+                    thumbnail.style.aspectRatio = "4/3";
+                    fileItem.appendChild(thumbnail);
+                }
+            } catch (error) {
+                console.error("サムネイル取得エラー:", error);
+            }
+
+            const fileName = document.createElement("div");
+            fileName.textContent = file.name.replace('.sb3.txt', '');
+            fileName.style.fontWeight = "bold";
+            fileName.style.textAlign = "center";
+            fileItem.appendChild(fileName);
+
+            // 短縮URL表示
+            const shortUrl = `${SHORT_URL}${file.id}`;
+            const urlContainer = document.createElement("div");
+            urlContainer.style.display = "flex";
+            urlContainer.style.gap = "0.5rem";
+            urlContainer.style.alignItems = "center";
+            urlContainer.style.fontSize = "0.8em";
+
+            const urlInput = document.createElement("input");
+            urlInput.type = "text";
+            urlInput.value = shortUrl;
+            urlInput.readOnly = true;
+            urlInput.style.flexGrow = "1";
+            urlInput.style.padding = "0.2rem";
+            urlInput.style.fontSize = "0.8em";
+
+            const copyButton = document.createElement("button");
+            copyButton.textContent = "コピー";
+            copyButton.className = "button";
+            copyButton.style.fontSize = "0.8em";
+            copyButton.style.padding = "0.2rem 0.5rem";
+
+            copyButton.addEventListener("click", () => {
+                urlInput.select();
+                document.execCommand("copy");
+                showAlert(addon, "success", "リンクをクリップボードにコピーしました");
+            });
+
+            urlContainer.appendChild(urlInput);
+            urlContainer.appendChild(copyButton);
+            fileItem.appendChild(urlContainer);
+
+            // 操作ボタン
+            const buttonsContainer = document.createElement("div");
+            buttonsContainer.style.display = "grid";
+            buttonsContainer.style.gridTemplateColumns = "1fr 1fr";
+            buttonsContainer.style.gap = "0.5rem";
+            buttonsContainer.style.marginTop = "0.5rem";
+
+            const loadButton = document.createElement("button");
+            loadButton.textContent = "読み込む";
+            loadButton.className = "button";
+            loadButton.style.fontSize = "0.8em";
+            loadButton.style.padding = "0.3rem";
+
+            loadButton.addEventListener("click", () => {
+                if (confirm(`"${file.name}"を読み込みますか？現在のプロジェクトは失われます。`)) {
+                    const url = `${PROXY_URL}${file.id}`;
+                    window.location.href = `?project_url=${encodeURIComponent(url)}`;
+                }
+            });
+
+            const replaceButton = document.createElement("button");
+            replaceButton.textContent = "上書き";
+            replaceButton.className = "button";
+            replaceButton.style.fontSize = "0.8em";
+            replaceButton.style.padding = "0.3rem";
+
+            replaceButton.addEventListener("click", () => {
+                if (confirm(`"${file.name}"を現在のプロジェクトで上書きしますか？`)) {
+                    saveToGoogleDrive(file.id, file.name, () => {
+                        // 上書き後にファイルリストを更新
+                        fetchDriveFiles(accessToken)
+                            .then(files => displayFileList(files, accessToken, modal, addon))
+                            .catch(error => console.error("更新エラー:", error));
+                    }, addon);
+                }
+            });
+
+            const deleteButton = document.createElement("button");
+            deleteButton.textContent = "削除";
+            deleteButton.className = "button";
+            deleteButton.style.fontSize = "0.8em";
+            deleteButton.style.padding = "0.3rem";
+            deleteButton.style.gridColumn = "1 / -1";
+            deleteButton.style.backgroundColor = "#ff4444";
+            deleteButton.style.color = "white";
+
+            deleteButton.addEventListener("click", () => {
+                if (confirm(`"${file.name}"を完全に削除しますか？この操作は元に戻せません。`)) {
+                    deleteFile(file.id, accessToken)
+                        .then(() => {
+                            showAlert(addon, "success", "ファイルを削除しました");
+                            return fetchDriveFiles(accessToken);
+                        })
+                        .then(files => displayFileList(files, accessToken, modal, addon))
+                        .catch(error => {
+                            console.error("削除エラー:", error);
+                            showAlert(addon, "error", "ファイルの削除に失敗しました");
+                        });
+                }
+            });
 
-    files.forEach(file => {
-      const fileItem = document.createElement("div");
-      fileItem.style.padding = "0.5rem";
-      fileItem.style.borderBottom = "1px solid #eee";
-      fileItem.style.display = "grid";
-      fileItem.style.gridTemplateColumns = "1fr auto auto";
-      fileItem.style.gap = "1rem";
-      fileItem.style.alignItems = "center";
-
-      const fileName = document.createElement("span");
-      fileName.textContent = file.name.replace('.sb3.txt', '');
-      
-      const loadButton = document.createElement("button");
-      loadButton.textContent = "読み込む";
-      loadButton.className = "button";
-      loadButton.style.width = "80px";
-
-      loadButton.addEventListener("click", (e) => {
-        e.stopPropagation();
-        if (confirm(`"${file.name}"を読み込みますか？現在のプロジェクトは失われます。`)) {
-          const url = `${PROXY_URL}${file.id}`;
-          window.location.href = `?project_url=${encodeURIComponent(url)}`;
+            buttonsContainer.appendChild(loadButton);
+            buttonsContainer.appendChild(replaceButton);
+            buttonsContainer.appendChild(deleteButton);
+            fileItem.appendChild(buttonsContainer);
+
+            fileList.appendChild(fileItem);
         }
-      });
-
-      const replaceButton = document.createElement("button");
-      replaceButton.textContent = "上書き保存";
-      replaceButton.className = "button";
-      replaceButton.style.width = "100px";
-
-      replaceButton.addEventListener("click", (e) => {
-        e.stopPropagation();
-        if (confirm(`"${file.name}"を現在のプロジェクトで上書きしますか？`)) {
-          saveToGoogleDrive(file.id, file.name, modal.remove, addon)
-            .catch(error => {
-              console.error("ファイル上書きエラー:", error);
-              showAlert(addon, "error", "ファイルの上書きに失敗しました");
+    }
+
+    async function getThumbnailForFile(fileId, accessToken) {
+        try {
+            const response = await fetch(`https://www.googleapis.com/drive/v3/files/${fileId}?fields=thumbnailLink`, {
+                headers: {
+                    Authorization: `Bearer ${accessToken}`,
+                },
             });
+
+            if (!response.ok) {
+                throw new Error(await response.text());
+            }
+
+            const data = await response.json();
+            return data.thumbnailLink || null;
+        } catch (error) {
+            console.error("サムネイル取得エラー:", error);
+            return null;
         }
-      });
-
-      // 共有リンクとコピーボタン
-      const linkContainer = document.createElement("div");
-      linkContainer.style.gridColumn = "1 / -1";
-      linkContainer.style.display = "flex";
-      linkContainer.style.alignItems = "center";
-      linkContainer.style.gap = "0.5rem";
-      linkContainer.style.fontSize = "0.9em";
-
-      const link = document.createElement("a");
-      link.href = `${SHORT_URL}${file.id}`;
-      link.textContent = `${SHORT_URL}${file.id}`;
-      link.target = "_blank";
-      link.rel = "noopener noreferrer";
-
-      const copyButton = document.createElement("button");
-      copyButton.textContent = "リンクをコピー";
-      copyButton.className = "button";
-      copyButton.style.fontSize = "0.8em";
-      copyButton.style.padding = "0.2rem 0.5rem";
-
-      copyButton.addEventListener("click", (e) => {
-        e.stopPropagation();
-        navigator.clipboard.writeText(`${SHORT_URL}${file.id}`)
-          .then(() => showAlert(addon, "success", "リンクをクリップボードにコピーしました"))
-          .catch(() => showAlert(addon, "error", "リンクのコピーに失敗しました"));
-      });
-
-      linkContainer.appendChild(document.createTextNode("共有リンク: "));
-      linkContainer.appendChild(link);
-      linkContainer.appendChild(copyButton);
-
-      fileItem.appendChild(fileName);
-      fileItem.appendChild(loadButton);
-      fileItem.appendChild(replaceButton);
-      fileItem.appendChild(linkContainer);
-      fileList.appendChild(fileItem);
-    });
-  }
-
-  async function saveToGoogleDrive(fileId, fileName, onSuccess, addon) {
-    try {
-      const blob = await window.vm.saveProjectSb3();
-      const projectName = window.vm.runtime.projectName || getProjectFilename || "無題";
-      const nameToUse = fileName || `${projectName}.sb3.txt`;
-      
-      const metadata = {
-        name: nameToUse,
-        mimeType: "application/x-scratch",
-      };
-
-      const url = fileId 
-        ? `https://www.googleapis.com/upload/drive/v3/files/${fileId}?uploadType=multipart`
-        : "https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart";
-
-      const form = new FormData();
-      form.append("metadata", new Blob([JSON.stringify(metadata)], { type: "application/json" }));
-      form.append("file", blob);
-
-      const method = fileId ? "PATCH" : "POST";
-
-      const uploadResponse = await fetch(url, {
-        method,
-        headers: {
-          Authorization: `Bearer ${accessToken}`,
-        },
-        body: form,
-      });
-
-      if (!uploadResponse.ok) {
-        throw new Error(await uploadResponse.text());
-      }
-
-      const fileData = await uploadResponse.json();
-      console.log("ファイルがGoogleドライブに保存/更新されました:", fileData);
-
-      if (!fileId) {
-        const permissionResponse = await fetch(`https://www.googleapis.com/drive/v3/files/${fileData.id}/permissions`, {
-          method: "POST",
-          headers: {
-            Authorization: `Bearer ${accessToken}`,
-            "Content-Type": "application/json",
-          },
-          body: JSON.stringify({
-            role: "reader",
-            type: "anyone",
-          }),
+    }
+
+    async function deleteFile(fileId, accessToken) {
+        const response = await fetch(`https://www.googleapis.com/drive/v3/files/${fileId}`, {
+            method: "DELETE",
+            headers: {
+                Authorization: `Bearer ${accessToken}`,
+            },
         });
 
-        if (!permissionResponse.ok) {
-          console.warn("権限の設定に失敗しましたが、ファイルは保存されました");
+        if (!response.ok) {
+            throw new Error(await response.text());
         }
-      }
-
-      const action = fileId ? "上書き保存" : "新規保存";
-      showAlert(addon, "success", `Googleドライブに${action}しました`);
-      if (onSuccess) onSuccess();
-    } catch (error) {
-      console.error("保存エラー:", error);
-      showAlert(addon, "error", `保存に失敗しました: ${error.message}`);
-      throw error;
     }
-  }
-
-  function showAlert(addon, type, message) {
-    addon.tab.redux.dispatch({
-      type: "scratch-gui/alerts/SHOW_ALERT",
-      payload: {
-        alertType: type,
-        message: message
-      }
-    });
-  }
+
+    async function saveToGoogleDrive(fileId, fileName, onSuccess, addon) {
+        try {
+            const blob = await window.vm.saveProjectSb3();
+            const projectName = window.vm.runtime.projectName || getProjectFilename || "無題";
+            const nameToUse = fileName || `${projectName}.sb3.txt`;
+            
+            const metadata = {
+                name: nameToUse,
+                mimeType: "application/x-scratch",
+            };
+
+            const url = fileId 
+                ? `https://www.googleapis.com/upload/drive/v3/files/${fileId}?uploadType=multipart`
+                : "https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart";
+
+            const form = new FormData();
+            form.append("metadata", new Blob([JSON.stringify(metadata)], { type: "application/json" }));
+            form.append("file", blob);
+
+            const method = fileId ? "PATCH" : "POST";
+
+            const uploadResponse = await fetch(url, {
+                method,
+                headers: {
+                    Authorization: `Bearer ${accessToken}`,
+                },
+                body: form,
+            });
+
+            if (!uploadResponse.ok) {
+                throw new Error(await uploadResponse.text());
+            }
+
+            const fileData = await uploadResponse.json();
+            console.log("ファイルがGoogleドライブに保存/更新されました:", fileData);
+
+            if (!fileId) {
+                const permissionResponse = await fetch(`https://www.googleapis.com/drive/v3/files/${fileData.id}/permissions`, {
+                    method: "POST",
+                    headers: {
+                        Authorization: `Bearer ${accessToken}`,
+                        "Content-Type": "application/json",
+                    },
+                    body: JSON.stringify({
+                        role: "reader",
+                        type: "anyone",
+                    }),
+                });
+
+                if (!permissionResponse.ok) {
+                    console.warn("権限の設定に失敗しましたが、ファイルは保存されました");
+                }
+            }
+
+            const action = fileId ? "上書き保存" : "新規保存";
+            showAlert(addon, "success", `Googleドライブに${action}しました`);
+            if (onSuccess) onSuccess();
+        } catch (error) {
+            console.error("保存エラー:", error);
+            showAlert(addon, "error", `保存に失敗しました: ${error.message}`);
+            throw error;
+        }
+    }
+
+    function showAlert(addon, type, message) {
+        addon.tab.redux.dispatch({
+            type: "scratch-gui/alerts/SHOW_ALERT",
+            payload: {
+                alertType: type,
+                message: message
+            }
+        });
+    }
 };