diff --git a/locales/en-US.yml b/locales/en-US.yml index 598f742896..03a5a91e84 100644 --- a/locales/en-US.yml +++ b/locales/en-US.yml @@ -321,6 +321,7 @@ lightThemes: "Light themes" darkThemes: "Dark themes" syncDeviceDarkMode: "Sync Dark Mode with your device settings" drive: "Drive" +driveSearchbarPlaceholder: "Search drive" fileName: "Filename" selectFile: "Select a file" selectFiles: "Select files" diff --git a/locales/index.d.ts b/locales/index.d.ts index e3434d7dbf..7020bc2159 100644 --- a/locales/index.d.ts +++ b/locales/index.d.ts @@ -1300,6 +1300,10 @@ export interface Locale extends ILocale { * ドライブ */ "drive": string; + /** + * 検索ドライブ + */ + "driveSearchbarPlaceholder": string; /** * ファイル名 */ diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index c25b421172..8f3bb4f48c 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -321,6 +321,7 @@ lightThemes: "明るいテーマ" darkThemes: "暗いテーマ" syncDeviceDarkMode: "デバイスのダークモードと同期する" drive: "ドライブ" +driveSearchbarPlaceholder: "検索ドライブ" fileName: "ファイル名" selectFile: "ファイルを選択" selectFiles: "ファイルを選択" diff --git a/packages/backend/src/server/api/endpoints/drive/files.ts b/packages/backend/src/server/api/endpoints/drive/files.ts index 10c521332d..6d87d5ddf7 100644 --- a/packages/backend/src/server/api/endpoints/drive/files.ts +++ b/packages/backend/src/server/api/endpoints/drive/files.ts @@ -9,6 +9,7 @@ import type { DriveFilesRepository } from '@/models/_.js'; import { QueryService } from '@/core/QueryService.js'; import { DriveFileEntityService } from '@/core/entities/DriveFileEntityService.js'; import { DI } from '@/di-symbols.js'; +import { sqlLikeEscape } from '@/misc/sql-like-escape.js'; export const meta = { tags: ['drive'], @@ -37,6 +38,7 @@ export const paramDef = { folderId: { type: 'string', format: 'misskey:id', nullable: true, default: null }, type: { type: 'string', nullable: true, pattern: /^[a-zA-Z\/\-*]+$/.toString().slice(1, -1) }, sort: { type: 'string', nullable: true, enum: ['+createdAt', '-createdAt', '+name', '-name', '+size', '-size', null] }, + searchQuery: { type: 'string', default: '' } }, required: [], } as const; @@ -60,6 +62,10 @@ export default class extends Endpoint { // eslint- query.andWhere('file.folderId IS NULL'); } + if (ps.searchQuery.length > 0) { + query.andWhere('file.name ILIKE :searchQuery OR file.comment ILIKE :searchQuery', { searchQuery: `%${sqlLikeEscape(ps.searchQuery)}%` }); + } + if (ps.type) { if (ps.type.endsWith('/*')) { query.andWhere('file.type like :type', { type: ps.type.replace('/*', '/') + '%' }); diff --git a/packages/backend/src/server/api/endpoints/drive/folders.ts b/packages/backend/src/server/api/endpoints/drive/folders.ts index 8c4848f8e1..9bcd824882 100644 --- a/packages/backend/src/server/api/endpoints/drive/folders.ts +++ b/packages/backend/src/server/api/endpoints/drive/folders.ts @@ -9,6 +9,7 @@ import type { DriveFoldersRepository } from '@/models/_.js'; import { QueryService } from '@/core/QueryService.js'; import { DriveFolderEntityService } from '@/core/entities/DriveFolderEntityService.js'; import { DI } from '@/di-symbols.js'; +import { sqlLikeEscape } from '@/misc/sql-like-escape.js'; export const meta = { tags: ['drive'], @@ -35,6 +36,7 @@ export const paramDef = { sinceId: { type: 'string', format: 'misskey:id' }, untilId: { type: 'string', format: 'misskey:id' }, folderId: { type: 'string', format: 'misskey:id', nullable: true, default: null }, + searchQuery: { type: 'string', default: '' } }, required: [], } as const; @@ -58,6 +60,9 @@ export default class extends Endpoint { // eslint- query.andWhere('folder.parentId IS NULL'); } + if (ps.searchQuery.length > 0) { + query.andWhere('folder.name ILIKE :searchQuery', { searchQuery: `%${sqlLikeEscape(ps.searchQuery)}%` }); + } const folders = await query.limit(ps.limit).getMany(); return await Promise.all(folders.map(folder => this.driveFolderEntityService.pack(folder))); diff --git a/packages/frontend/src/components/MkDrive.vue b/packages/frontend/src/components/MkDrive.vue index a9717b4fb7..222fabb8f4 100644 --- a/packages/frontend/src/components/MkDrive.vue +++ b/packages/frontend/src/components/MkDrive.vue @@ -30,7 +30,14 @@ SPDX-License-Identifier: AGPL-3.0-only {{ folder.name }} - +
+ + + + + + +
{ if (fetchedFolders.length === foldersMax + 1) { moreFolders.value = true; @@ -552,6 +563,7 @@ async function fetch() { folderId: folder.value ? folder.value.id : null, type: props.type, limit: filesMax + 1, + searchQuery: searchQuery.value.toString().trim(), }).then(fetchedFiles => { if (fetchedFiles.length === filesMax + 1) { moreFiles.value = true; @@ -578,6 +590,7 @@ function fetchMoreFolders() { type: props.type, untilId: folders.value.at(-1)?.id, limit: max + 1, + searchQuery: searchQuery.value.toString().trim(), }).then(folders => { if (folders.length === max + 1) { moreFolders.value = true; @@ -601,6 +614,7 @@ function fetchMoreFiles() { type: props.type, untilId: files.value.at(-1)?.id, limit: max + 1, + searchQuery: searchQuery.value.toString().trim(), }).then(files => { if (files.length === max + 1) { moreFiles.value = true; @@ -747,8 +761,13 @@ onBeforeUnmount(() => { } .navMenu { + display: flex; margin-left: auto; - padding: 0 12px; + align-items: center; +} + +.navMenu > *:not(:last-child) { + padding-right: 12px; } .main {