From f5100cc81f6ffdcfe2b9bf6041f97098a4e82d02 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=8B=E3=81=A3=E3=81=93=E3=81=8B=E3=82=8A?=
<67428053+kakkokari-gtyih@users.noreply.github.com>
Date: Sat, 13 Apr 2024 12:51:37 +0900
Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E3=82=A2=E3=83=83=E3=83=97?=
=?UTF-8?q?=E3=83=AD=E3=83=BC=E3=83=89=E3=81=99=E3=82=8B=E3=83=95=E3=82=A1?=
=?UTF-8?q?=E3=82=A4=E3=83=AB=E3=81=AE=E5=90=8D=E5=89=8D=E3=82=92=E3=83=A9?=
=?UTF-8?q?=E3=83=B3=E3=83=80=E3=83=A0=E6=96=87=E5=AD=97=E5=88=97=E3=81=AB?=
=?UTF-8?q?=E3=81=A7=E3=81=8D=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB=20(#1368?=
=?UTF-8?q?8)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
* feat(frontend): アップロードするファイルの名前をランダム文字列にできるように
* Update Changelog
* refactor
* 設定項目を移動
* fix
* 「オリジナルのファイル名を保持」に変更
* 拡張子を付加するように
---
CHANGELOG.md | 1 +
locales/index.d.ts | 8 ++++++++
locales/ja-JP.yml | 2 ++
packages/frontend/src/pages/settings/drive.vue | 5 +++++
packages/frontend/src/scripts/upload.ts | 10 +++++++---
packages/frontend/src/store.ts | 4 ++++
6 files changed, 27 insertions(+), 3 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index ab4ecb3ffe..1332da69f9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@
- Fix: Play作成時に設定した公開範囲が機能していない問題を修正
### Client
+- Feat: アップロードするファイルの名前をランダム文字列にできるように
- Enhance: 自分のノートの添付ファイルから直接ファイルの詳細ページに飛べるように
- Enhance: 広告がMisskeyと同一ドメインの場合はRouterで遷移するように
- Enhance: リアクション・いいねの総数を表示するように
diff --git a/locales/index.d.ts b/locales/index.d.ts
index 54f0285726..d6875c0868 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -4936,6 +4936,14 @@ export interface Locale extends ILocale {
* 動画・音声の再生にブラウザのUIを使用する
*/
"useNativeUIForVideoAudioPlayer": string;
+ /**
+ * オリジナルのファイル名を保持
+ */
+ "keepOriginalFilename": string;
+ /**
+ * この設定をオフにすると、アップロード時にファイル名が自動でランダム文字列に置き換えられます。
+ */
+ "keepOriginalFilenameDescription": string;
"_bubbleGame": {
/**
* 遊び方
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index ac88420b9d..0b581a01e3 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1230,6 +1230,8 @@ useTotp: "ワンタイムパスワードを使う"
useBackupCode: "バックアップコードを使う"
launchApp: "アプリを起動"
useNativeUIForVideoAudioPlayer: "動画・音声の再生にブラウザのUIを使用する"
+keepOriginalFilename: "オリジナルのファイル名を保持"
+keepOriginalFilenameDescription: "この設定をオフにすると、アップロード時にファイル名が自動でランダム文字列に置き換えられます。"
_bubbleGame:
howToPlay: "遊び方"
diff --git a/packages/frontend/src/pages/settings/drive.vue b/packages/frontend/src/pages/settings/drive.vue
index 1919f80864..81a8d474d2 100644
--- a/packages/frontend/src/pages/settings/drive.vue
+++ b/packages/frontend/src/pages/settings/drive.vue
@@ -44,6 +44,10 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ i18n.ts.keepOriginalUploading }}
{{ i18n.ts.keepOriginalUploadingDescription }}
+
+ {{ i18n.ts.keepOriginalFilename }}
+ {{ i18n.ts.keepOriginalFilenameDescription }}
+
{{ i18n.ts.alwaysMarkSensitive }}
@@ -96,6 +100,7 @@ const meterStyle = computed(() => {
});
const keepOriginalUploading = computed(defaultStore.makeGetterSetter('keepOriginalUploading'));
+const keepOriginalFilename = computed(defaultStore.makeGetterSetter('keepOriginalFilename'));
misskeyApi('drive').then(info => {
capacity.value = info.capacity;
diff --git a/packages/frontend/src/scripts/upload.ts b/packages/frontend/src/scripts/upload.ts
index 6c46b2bc1b..3e947183c9 100644
--- a/packages/frontend/src/scripts/upload.ts
+++ b/packages/frontend/src/scripts/upload.ts
@@ -5,6 +5,7 @@
import { reactive, ref } from 'vue';
import * as Misskey from 'misskey-js';
+import { v4 as uuid } from 'uuid';
import { readAndCompressImage } from '@misskey-dev/browser-image-resizer';
import { getCompressionConfig } from './upload/compress-config.js';
import { defaultStore } from '@/store.js';
@@ -39,13 +40,16 @@ export function uploadFile(
if (folder && typeof folder === 'object') folder = folder.id;
return new Promise((resolve, reject) => {
- const id = Math.random().toString();
+ const id = uuid();
const reader = new FileReader();
reader.onload = async (): Promise => {
+ const filename = name ?? file.name ?? 'untitled';
+ const extension = filename.split('.').length > 1 ? '.' + filename.split('.').pop() : '';
+
const ctx = reactive({
- id: id,
- name: name ?? file.name ?? 'untitled',
+ id,
+ name: defaultStore.state.keepOriginalFilename ? filename : id + extension,
progressMax: undefined,
progressValue: undefined,
img: window.URL.createObjectURL(file),
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index faefbd8ce4..9b5011739a 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -446,6 +446,10 @@ export const defaultStore = markRaw(new Storage('base', {
where: 'device',
default: false,
},
+ keepOriginalFilename: {
+ where: 'device',
+ default: true,
+ },
sound_masterVolume: {
where: 'device',