{{ i18n.ts.visibility }}
@@ -53,7 +53,7 @@ const props = withDefaults(defineProps<{
currentVisibility: typeof Misskey.noteVisibilities[number];
isSilenced: boolean;
localOnly: boolean;
- src?: HTMLElement;
+ anchorElement?: HTMLElement;
isReplyVisibilitySpecified?: boolean;
}>(), {
});
diff --git a/packages/frontend/src/components/MkYouTubePlayer.vue b/packages/frontend/src/components/MkYouTubePlayer.vue
index ab62a5113d..2375bcc9eb 100644
--- a/packages/frontend/src/components/MkYouTubePlayer.vue
+++ b/packages/frontend/src/components/MkYouTubePlayer.vue
@@ -27,7 +27,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { ref } from 'vue';
import { versatileLang } from '@@/js/intl-const.js';
import MkWindow from '@/components/MkWindow.vue';
-import { transformPlayerUrl } from '@/utility/player-url-transform.js';
+import { transformPlayerUrl } from '@/utility/url-preview.js';
import { prefer } from '@/preferences.js';
const props = defineProps<{
diff --git a/packages/frontend/src/components/global/MkAvatar.vue b/packages/frontend/src/components/global/MkAvatar.vue
index 97c2069a2f..8a9cc5286a 100644
--- a/packages/frontend/src/components/global/MkAvatar.vue
+++ b/packages/frontend/src/components/global/MkAvatar.vue
@@ -5,7 +5,8 @@ SPDX-License-Identifier: AGPL-3.0-only
- ![]()
+
{{ i18n.ts._abuseUserReport.resolveTutorial }}
-
+
@@ -65,7 +65,6 @@ import XAbuseReport from '@/components/MkAbuseReport.vue';
import { i18n } from '@/i18n.js';
import { definePage } from '@/page.js';
import MkButton from '@/components/MkButton.vue';
-import MkInfo from '@/components/MkInfo.vue';
import { store } from '@/store.js';
const reports = useTemplateRef('reports');
@@ -90,10 +89,6 @@ function resolved(reportId) {
reports.value?.paginator.removeItem(reportId);
}
-function closeTutorial() {
- store.set('abusesTutorial', false);
-}
-
const headerActions = computed(() => []);
const headerTabs = computed(() => []);
diff --git a/packages/frontend/src/pages/admin/custom-emojis-manager.local.list.vue b/packages/frontend/src/pages/admin/custom-emojis-manager.local.list.vue
index 0ff251abb8..68c7048ae1 100644
--- a/packages/frontend/src/pages/admin/custom-emojis-manager.local.list.vue
+++ b/packages/frontend/src/pages/admin/custom-emojis-manager.local.list.vue
@@ -87,7 +87,7 @@ import MkButton from '@/components/MkButton.vue';
import { validators } from '@/components/grid/cell-validators.js';
import { misskeyApi } from '@/utility/misskey-api.js';
import MkPagingButtons from '@/components/MkPagingButtons.vue';
-import { selectFile } from '@/utility/select-file.js';
+import { selectFile } from '@/utility/drive.js';
import { copyGridDataToClipboard, removeDataFromGrid } from '@/components/grid/grid-utils.js';
import { useLoading } from '@/composables/use-loading.js';
diff --git a/packages/frontend/src/pages/admin/custom-emojis-manager.register.vue b/packages/frontend/src/pages/admin/custom-emojis-manager.register.vue
index e8e944df32..e1dabe549f 100644
--- a/packages/frontend/src/pages/admin/custom-emojis-manager.register.vue
+++ b/packages/frontend/src/pages/admin/custom-emojis-manager.register.vue
@@ -35,20 +35,9 @@ SPDX-License-Identifier: AGPL-3.0-only
+
+
+ {{ i18n.ts.emojiMute }}
+
+
+
+
import { ref, computed, watch } from 'vue';
+import XEmojiMute from './mute-block.emoji-mute.vue';
import XInstanceMute from './mute-block.instance-mute.vue';
import XWordMute from './mute-block.word-mute.vue';
import MkPagination from '@/components/MkPagination.vue';
diff --git a/packages/frontend/src/pages/settings/notifications.vue b/packages/frontend/src/pages/settings/notifications.vue
index e42e6613ac..4e8d88ab74 100644
--- a/packages/frontend/src/pages/settings/notifications.vue
+++ b/packages/frontend/src/pages/settings/notifications.vue
@@ -38,11 +38,12 @@ SPDX-License-Identifier: AGPL-3.0-only
-
@@ -120,6 +123,11 @@ SPDX-License-Identifier: AGPL-3.0-only
+ {{ i18n.ts.redisplayAllTips }}
+ {{ i18n.ts.hideAllTips }}
+
+
+
{{ i18n.ts.migrateOldSettings }}
{{ i18n.ts.migrateOldSettings_description }}
@@ -149,6 +157,7 @@ import { prefer } from '@/preferences.js';
import MkRolePreview from '@/components/MkRolePreview.vue';
import { signout } from '@/signout.js';
import { migrateOldSettings } from '@/pref-migrate.js';
+import { store, TIPS } from '@/store.js';
const $i = ensureSignin();
@@ -157,6 +166,7 @@ const enableCondensedLine = prefer.model('enableCondensedLine');
const skipNoteRender = prefer.model('skipNoteRender');
const devMode = prefer.model('devMode');
const stackingRouterView = prefer.model('experimental.stackingRouterView');
+const enableFolderPageView = prefer.model('experimental.enableFolderPageView');
watch(skipNoteRender, async () => {
await reloadAsk({ reason: i18n.ts.reloadToApplySetting, unison: true });
@@ -190,6 +200,20 @@ function migrate() {
migrateOldSettings();
}
+function resetAllTips() {
+ store.set('tips', {});
+ os.success();
+}
+
+function hideAllTips() {
+ const v = {};
+ for (const k of TIPS) {
+ v[k] = true;
+ }
+ store.set('tips', v);
+ os.success();
+}
+
const headerActions = computed(() => []);
const headerTabs = computed(() => []);
diff --git a/packages/frontend/src/pages/settings/preferences.vue b/packages/frontend/src/pages/settings/preferences.vue
index c6732e7787..18dfc2250c 100644
--- a/packages/frontend/src/pages/settings/preferences.vue
+++ b/packages/frontend/src/pages/settings/preferences.vue
@@ -557,6 +557,15 @@ SPDX-License-Identifier: AGPL-3.0-only
- {{ i18n.ts._dataSaver._urlPreview.title }}
- {{ i18n.ts._dataSaver._urlPreview.description }}
+
+ {{ i18n.ts._dataSaver._disableUrlPreview.title }}
+ {{ i18n.ts._dataSaver._disableUrlPreview.description }}
+
+
+ {{ i18n.ts._dataSaver._urlPreviewThumbnail.title }}
+ {{ i18n.ts._dataSaver._urlPreviewThumbnail.description }}
{{ i18n.ts._dataSaver._code.title }}
@@ -808,6 +848,7 @@ const defaultFollowWithReplies = prefer.model('defaultFollowWithReplies');
const chatShowSenderName = prefer.model('chat.showSenderName');
const chatSendOnEnter = prefer.model('chat.sendOnEnter');
const useStickyIcons = prefer.model('useStickyIcons');
+const enableHighQualityImagePlaceholders = prefer.model('enableHighQualityImagePlaceholders');
const reduceAnimation = prefer.model('animation', v => !v, v => !v);
const animatedMfm = prefer.model('animatedMfm');
const disableShowingAnimatedImages = prefer.model('disableShowingAnimatedImages');
@@ -866,6 +907,7 @@ watch([
enableSeasonalScreenEffect,
chatShowSenderName,
useStickyIcons,
+ enableHighQualityImagePlaceholders,
keepScreenOn,
contextMenu,
fontSize,
@@ -873,6 +915,7 @@ watch([
makeEveryTextElementsSelectable,
enableHorizontalSwipe,
enablePullToRefresh,
+ reduceAnimation,
], async () => {
await reloadAsk({ reason: i18n.ts.reloadToApplySetting, unison: true });
});
diff --git a/packages/frontend/src/pages/settings/profile.vue b/packages/frontend/src/pages/settings/profile.vue
index 30b7cf9a86..cd1565f39e 100644
--- a/packages/frontend/src/pages/settings/profile.vue
+++ b/packages/frontend/src/pages/settings/profile.vue
@@ -161,7 +161,7 @@ import MkSelect from '@/components/MkSelect.vue';
import FormSplit from '@/components/form/split.vue';
import MkFolder from '@/components/MkFolder.vue';
import FormSlot from '@/components/form/slot.vue';
-import { selectFile } from '@/utility/select-file.js';
+import { chooseDriveFile } from '@/utility/drive.js';
import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
import { ensureSignin } from '@/i.js';
@@ -257,54 +257,100 @@ function save() {
}
function changeAvatar(ev) {
- selectFile(ev.currentTarget ?? ev.target, i18n.ts.avatar).then(async (file) => {
- let originalOrCropped = file;
-
- const { canceled } = await os.confirm({
- type: 'question',
- text: i18n.ts.cropImageAsk,
- okText: i18n.ts.cropYes,
- cancelText: i18n.ts.cropNo,
- });
-
- if (!canceled) {
- originalOrCropped = await os.cropImage(file, {
- aspectRatio: 1,
- });
- }
-
+ async function done(driveFile) {
const i = await os.apiWithDialog('i/update', {
- avatarId: originalOrCropped.id,
+ avatarId: driveFile.id,
});
$i.avatarId = i.avatarId;
$i.avatarUrl = i.avatarUrl;
claimAchievement('profileFilled');
- });
+ }
+
+ os.popupMenu([{
+ text: i18n.ts.avatar,
+ type: 'label',
+ }, {
+ text: i18n.ts.upload,
+ icon: 'ti ti-upload',
+ action: async () => {
+ const files = await os.chooseFileFromPc({ multiple: false });
+ const file = files[0];
+
+ let originalOrCropped = file;
+
+ const { canceled } = await os.confirm({
+ type: 'question',
+ text: i18n.ts.cropImageAsk,
+ okText: i18n.ts.cropYes,
+ cancelText: i18n.ts.cropNo,
+ });
+
+ if (!canceled) {
+ originalOrCropped = await os.cropImageFile(file, {
+ aspectRatio: 1,
+ });
+ }
+
+ const driveFile = (await os.launchUploader([originalOrCropped], { multiple: false }))[0];
+ done(driveFile);
+ },
+ }, {
+ text: i18n.ts.fromDrive,
+ icon: 'ti ti-cloud',
+ action: () => {
+ chooseDriveFile({ multiple: false }).then(files => {
+ done(files[0]);
+ });
+ },
+ }], ev.currentTarget ?? ev.target);
}
function changeBanner(ev) {
- selectFile(ev.currentTarget ?? ev.target, i18n.ts.banner).then(async (file) => {
- let originalOrCropped = file;
-
- const { canceled } = await os.confirm({
- type: 'question',
- text: i18n.ts.cropImageAsk,
- okText: i18n.ts.cropYes,
- cancelText: i18n.ts.cropNo,
- });
-
- if (!canceled) {
- originalOrCropped = await os.cropImage(file, {
- aspectRatio: 2,
- });
- }
-
+ async function done(driveFile) {
const i = await os.apiWithDialog('i/update', {
- bannerId: originalOrCropped.id,
+ bannerId: driveFile.id,
});
$i.bannerId = i.bannerId;
$i.bannerUrl = i.bannerUrl;
- });
+ }
+
+ os.popupMenu([{
+ text: i18n.ts.banner,
+ type: 'label',
+ }, {
+ text: i18n.ts.upload,
+ icon: 'ti ti-upload',
+ action: async () => {
+ const files = await os.chooseFileFromPc({ multiple: false });
+ const file = files[0];
+
+ let originalOrCropped = file;
+
+ const { canceled } = await os.confirm({
+ type: 'question',
+ text: i18n.ts.cropImageAsk,
+ okText: i18n.ts.cropYes,
+ cancelText: i18n.ts.cropNo,
+ });
+
+ if (!canceled) {
+ originalOrCropped = await os.cropImageFile(file, {
+ aspectRatio: 2,
+ });
+ }
+
+ const driveFile = (await os.launchUploader([originalOrCropped], { multiple: false }))[0];
+ done(driveFile);
+ },
+ }, {
+ text: i18n.ts.fromDrive,
+ icon: 'ti ti-cloud',
+ action: () => {
+ chooseDriveFile({ multiple: false }).then(files => {
+ done(files[0]);
+ });
+ },
+ }], ev.currentTarget ?? ev.target);
}
const headerActions = computed(() => []);
diff --git a/packages/frontend/src/pages/settings/sounds.sound.vue b/packages/frontend/src/pages/settings/sounds.sound.vue
index 1bac19fe47..ffbbefa122 100644
--- a/packages/frontend/src/pages/settings/sounds.sound.vue
+++ b/packages/frontend/src/pages/settings/sounds.sound.vue
@@ -40,7 +40,7 @@ import { i18n } from '@/i18n.js';
import * as os from '@/os.js';
import { misskeyApi } from '@/utility/misskey-api.js';
import { playMisskeySfxFile, soundsTypes, getSoundDuration } from '@/utility/sound.js';
-import { selectFile } from '@/utility/select-file.js';
+import { selectFile } from '@/utility/drive.js';
const props = defineProps<{
type: SoundType;
diff --git a/packages/frontend/src/pages/timeline.vue b/packages/frontend/src/pages/timeline.vue
index 453a48d1bc..5696d1dd89 100644
--- a/packages/frontend/src/pages/timeline.vue
+++ b/packages/frontend/src/pages/timeline.vue
@@ -6,9 +6,9 @@ SPDX-License-Identifier: AGPL-3.0-only
@@ -217,7 +217,7 @@ const props = withDefaults(defineProps<{
});
const emit = defineEmits<{
- (ev: 'unfoldFiles'): void;
+ (ev: 'showMoreFiles'): void;
}>();
const router = useRouter();
diff --git a/packages/frontend/src/pages/user/index.files.vue b/packages/frontend/src/pages/user/index.files.vue
index 6c3b8408fb..58f6b0ca45 100644
--- a/packages/frontend/src/pages/user/index.files.vue
+++ b/packages/frontend/src/pages/user/index.files.vue
@@ -4,13 +4,16 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
-
+
{{ i18n.ts.files }}
([]);
-function unfoldContainer(): boolean {
- emit('unfold');
- return false;
-}
-
onMounted(() => {
misskeyApi('users/notes', {
userId: props.user.id,
@@ -62,39 +61,9 @@ onMounted(() => {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
grid-gap: 6px;
-}
-.img {
- position: relative;
- height: 128px;
- border-radius: 6px;
- overflow: clip;
-}
-
-.empty {
- margin: 0;
- padding: 16px;
- text-align: center;
-}
-
-.sensitiveImg {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- filter: brightness(0.7);
-}
-.sensitive {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- display: grid;
- place-items: center;
- font-size: 0.8em;
- color: #fff;
- cursor: pointer;
+ >:nth-child(n+9) {
+ display: none;
+ }
}
diff --git a/packages/frontend/src/pages/user/index.vue b/packages/frontend/src/pages/user/index.vue
index d4f36271ad..11e26b26f9 100644
--- a/packages/frontend/src/pages/user/index.vue
+++ b/packages/frontend/src/pages/user/index.vue
@@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only
@@ -32,7 +32,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { ref } from 'vue';
import * as Misskey from 'misskey-js';
import XTimeline from './welcome.timeline.vue';
-import MarqueeText from '@/components/MkMarquee.vue';
+import MkMarqueeText from '@/components/MkMarqueeText.vue';
import MkFeaturedPhotos from '@/components/MkFeaturedPhotos.vue';
import misskeysvg from '/client-assets/misskey.svg';
import { misskeyApiGet } from '@/utility/misskey-api.js';
diff --git a/packages/frontend/src/preferences/def.ts b/packages/frontend/src/preferences/def.ts
index af4423c6a4..27402a8e6a 100644
--- a/packages/frontend/src/preferences/def.ts
+++ b/packages/frontend/src/preferences/def.ts
@@ -202,6 +202,9 @@ export const PREF_DEF = {
useStickyIcons: {
default: true,
},
+ enableHighQualityImagePlaceholders: {
+ default: true,
+ },
showFixedPostForm: {
default: false,
},
@@ -287,9 +290,10 @@ export const PREF_DEF = {
default: {
media: false,
avatar: false,
- urlPreview: false,
+ urlPreviewThumbnail: false,
+ disableUrlPreview: false,
code: false,
- } as Record,
+ } satisfies Record,
},
hemisphere: {
default: hemisphere as 'N' | 'S',
@@ -342,6 +346,9 @@ export const PREF_DEF = {
plugins: {
default: [] as Plugin[],
},
+ mutingEmojis: {
+ default: [] as string[],
+ },
'sound.masterVolume': {
default: 0.3,
@@ -410,4 +417,7 @@ export const PREF_DEF = {
'experimental.stackingRouterView': {
default: false,
},
+ 'experimental.enableFolderPageView': {
+ default: false,
+ },
} satisfies PreferencesDefinition;
diff --git a/packages/frontend/src/store.ts b/packages/frontend/src/store.ts
index 06c2f9149c..6f9b5786ee 100644
--- a/packages/frontend/src/store.ts
+++ b/packages/frontend/src/store.ts
@@ -14,6 +14,18 @@ import { miLocalStorage } from '@/local-storage.js';
import { Pizzax } from '@/lib/pizzax.js';
import { DEFAULT_DEVICE_KIND } from '@/utility/device-kind.js';
+export const TIPS = [
+ 'drive',
+ 'uploader',
+ 'clips',
+ 'userLists',
+ 'tl.home',
+ 'tl.local',
+ 'tl.social',
+ 'tl.global',
+ 'abuses',
+] as const;
+
/**
* 「状態」を管理するストア(not「設定」)
*/
@@ -22,22 +34,9 @@ export const store = markRaw(new Pizzax('base', {
where: 'account',
default: 0,
},
- timelineTutorials: {
- where: 'account',
- default: {
- home: false,
- local: false,
- social: false,
- global: false,
- },
- },
- abusesTutorial: {
- where: 'account',
- default: false,
- },
- readDriveTip: {
- where: 'account',
- default: false,
+ tips: {
+ where: 'device',
+ default: {} as Partial>, // true = 既読
},
memo: {
where: 'account',
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss
index 30936fbb10..12879e63b3 100644
--- a/packages/frontend/src/style.scss
+++ b/packages/frontend/src/style.scss
@@ -90,12 +90,49 @@ html {
}
}
-html._themeChanging_ {
+html._themeChangingFallback_ {
&, * {
- transition: background 1s ease, border 1s ease !important;
+ transition: background 0.5s ease, border 0.5s ease !important;
}
}
+html._themeChanging_ {
+ view-transition-name: theme-changing;
+}
+
+html::view-transition-new(theme-changing) {
+ z-index: 4000001;
+ animation: themeChangingNew 0.5s ease;
+ animation-fill-mode: forwards;
+}
+
+html::view-transition-old(theme-changing) {
+ z-index: 4000000;
+ animation: themeChangingOld 0.5s ease;
+ animation-fill-mode: forwards;
+}
+
+@keyframes themeChangingNew {
+ 0% {
+ opacity: 0;
+ }
+
+ 100% {
+ opacity: 1;
+ }
+}
+
+@keyframes themeChangingOld {
+ 0% {
+ opacity: 1;
+ }
+
+ 100% {
+ opacity: 0;
+ }
+
+}
+
html,
body,
#misskey_app {
diff --git a/packages/frontend/src/theme.ts b/packages/frontend/src/theme.ts
index 268f879d17..9562f69cf3 100644
--- a/packages/frontend/src/theme.ts
+++ b/packages/frontend/src/theme.ts
@@ -3,7 +3,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
-import { ref } from 'vue';
+import { ref, nextTick } from 'vue';
import tinycolor from 'tinycolor2';
import lightTheme from '@@/themes/_light.json5';
import darkTheme from '@@/themes/_dark.json5';
@@ -88,20 +88,7 @@ export async function removeTheme(theme: Theme): Promise {
prefer.commit('themes', themes);
}
-let timeout: number | null = null;
-
-export function applyTheme(theme: Theme, persist = true) {
- if (timeout) window.clearTimeout(timeout);
-
- window.document.documentElement.classList.add('_themeChanging_');
-
- timeout = window.setTimeout(() => {
- window.document.documentElement.classList.remove('_themeChanging_');
-
- // 色計算など再度行えるようにクライアント全体に通知
- globalEvents.emit('themeChanged');
- }, 1000);
-
+function applyThemeInternal(theme: Theme, persist: boolean) {
const colorScheme = theme.base === 'dark' ? 'dark' : 'light';
window.document.documentElement.dataset.colorScheme = colorScheme;
@@ -139,6 +126,37 @@ export function applyTheme(theme: Theme, persist = true) {
globalEvents.emit('themeChanging');
}
+let timeout: number | null = null;
+
+export function applyTheme(theme: Theme, persist = true) {
+ if (timeout) {
+ window.clearTimeout(timeout);
+ timeout = null;
+ }
+
+ if (window.document.startViewTransition != null && prefer.s.animation) {
+ window.document.documentElement.classList.add('_themeChanging_');
+ window.document.startViewTransition(async () => {
+ applyThemeInternal(theme, persist);
+ await nextTick();
+ }).finished.then(() => {
+ window.document.documentElement.classList.remove('_themeChanging_');
+ // 色計算など再度行えるようにクライアント全体に通知
+ globalEvents.emit('themeChanged');
+ });
+ } else {
+ // TODO: ViewTransition API が主要ブラウザで対応したら消す
+ window.document.documentElement.classList.add('_themeChangingFallback_');
+ timeout = window.setTimeout(() => {
+ window.document.documentElement.classList.remove('_themeChangingFallback_');
+ // 色計算など再度行えるようにクライアント全体に通知
+ globalEvents.emit('themeChanged');
+ }, 500);
+
+ applyThemeInternal(theme, persist);
+ }
+}
+
export function compile(theme: Theme): Record {
function getColor(val: string): tinycolor.Instance {
if (val[0] === '@') { // ref (prop)
diff --git a/packages/frontend/src/ui/_common_/common.vue b/packages/frontend/src/ui/_common_/common.vue
index fcf9fb234d..da20d23cfd 100644
--- a/packages/frontend/src/ui/_common_/common.vue
+++ b/packages/frontend/src/ui/_common_/common.vue
@@ -65,8 +65,6 @@ SPDX-License-Identifier: AGPL-3.0-only
v-on="popup.events"
/>
- import('./stream-indicator.vue'));
-const XUpload = defineAsyncComponent(() => import('./upload.vue'));
const XWidgets = defineAsyncComponent(() => import('./widgets.vue'));
const drawerMenuShowing = defineModel('drawerMenuShowing');
diff --git a/packages/frontend/src/ui/_common_/mobile-footer-menu.vue b/packages/frontend/src/ui/_common_/mobile-footer-menu.vue
index 88c6191e5a..e2993230be 100644
--- a/packages/frontend/src/ui/_common_/mobile-footer-menu.vue
+++ b/packages/frontend/src/ui/_common_/mobile-footer-menu.vue
@@ -136,7 +136,7 @@ watch(rootEl, () => {
}
.itemIcon {
- font-size: 14px;
+ font-size: 15px;
}
.itemIndicator {
diff --git a/packages/frontend/src/ui/_common_/navbar-h.vue b/packages/frontend/src/ui/_common_/navbar-h.vue
index 13fc592e70..24e2b28f1c 100644
--- a/packages/frontend/src/ui/_common_/navbar-h.vue
+++ b/packages/frontend/src/ui/_common_/navbar-h.vue
@@ -73,7 +73,7 @@ const otherNavItemIndicated = computed(() => {
function more(ev: MouseEvent) {
const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkLaunchPad.vue')), {
- src: ev.currentTarget ?? ev.target,
+ anchorElement: ev.currentTarget ?? ev.target,
anchor: { x: 'center', y: 'bottom' },
}, {
closed: () => dispose(),
diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue
index 7cfedc939f..c8b7491895 100644
--- a/packages/frontend/src/ui/_common_/navbar.vue
+++ b/packages/frontend/src/ui/_common_/navbar.vue
@@ -180,7 +180,7 @@ function more(ev: MouseEvent) {
const target = getHTMLElementOrNull(ev.currentTarget ?? ev.target);
if (!target) return;
const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkLaunchPad.vue')), {
- src: target,
+ anchorElement: target,
}, {
closed: () => dispose(),
});
@@ -407,6 +407,7 @@ function menuEdit() {
z-index: 1;
display: flex;
height: var(--top-height);
+ padding-left: 6px;
}
.instance {
diff --git a/packages/frontend/src/ui/_common_/statusbar-federation.vue b/packages/frontend/src/ui/_common_/statusbar-federation.vue
index 16e72fa227..7248e8826b 100644
--- a/packages/frontend/src/ui/_common_/statusbar-federation.vue
+++ b/packages/frontend/src/ui/_common_/statusbar-federation.vue
@@ -13,7 +13,7 @@ SPDX-License-Identifier: AGPL-3.0-only
:leaveToClass="$style.transition_change_leaveTo"
mode="default"
>
-
+
![]()
@@ -21,7 +21,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-
+
@@ -33,7 +33,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-
-
diff --git a/packages/frontend/src/ui/deck/column.vue b/packages/frontend/src/ui/deck/column.vue
index 2085c73e03..4e79b301e3 100644
--- a/packages/frontend/src/ui/deck/column.vue
+++ b/packages/frontend/src/ui/deck/column.vue
@@ -51,6 +51,7 @@ import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
import { prefer } from '@/preferences.js';
import { DI } from '@/di.js';
+import { checkDragDataType, getDragData, setDragData } from '@/drag-and-drop.js';
provide('shouldHeaderThin', true);
provide('shouldOmitHeaderTitle', true);
@@ -262,7 +263,7 @@ function goTop() {
function onDragstart(ev) {
ev.dataTransfer.effectAllowed = 'move';
- ev.dataTransfer.setData(_DATA_TRANSFER_DECK_COLUMN_, props.column.id);
+ setDragData(ev, 'deckColumn', props.column.id);
// Chromeのバグで、Dragstartハンドラ内ですぐにDOMを変更する(=リアクティブなプロパティを変更する)とDragが終了してしまう
// SEE: https://stackoverflow.com/questions/19639969/html5-dragend-event-firing-immediately
@@ -281,7 +282,7 @@ function onDragover(ev) {
// 自分自身にはドロップさせない
ev.dataTransfer.dropEffect = 'none';
} else {
- const isDeckColumn = ev.dataTransfer.types[0] === _DATA_TRANSFER_DECK_COLUMN_;
+ const isDeckColumn = checkDragDataType(ev, ['deckColumn']);
ev.dataTransfer.dropEffect = isDeckColumn ? 'move' : 'none';
@@ -297,8 +298,8 @@ function onDrop(ev) {
draghover.value = false;
os.deckGlobalEvents.emit('column.dragEnd');
- const id = ev.dataTransfer.getData(_DATA_TRANSFER_DECK_COLUMN_);
- if (id != null && id !== '') {
+ const id = getDragData(ev, 'deckColumn');
+ if (id != null) {
swapColumn(props.column.id, id);
}
}
diff --git a/packages/frontend/src/utility/code-highlighter.ts b/packages/frontend/src/utility/code-highlighter.ts
index 4f2aff9d4c..7dca18d58f 100644
--- a/packages/frontend/src/utility/code-highlighter.ts
+++ b/packages/frontend/src/utility/code-highlighter.ts
@@ -4,7 +4,7 @@
*/
import { createHighlighterCore } from 'shiki/core';
-import { createOnigurumaEngine } from 'shiki/engine/oniguruma';
+import { createJavaScriptRegexEngine } from 'shiki/engine/javascript';
import darkPlus from 'shiki/themes/dark-plus.mjs';
import { bundledThemesInfo } from 'shiki/themes';
import { bundledLanguagesInfo } from 'shiki/langs';
@@ -71,7 +71,7 @@ async function initHighlighter() {
const jsLangInfo = bundledLanguagesInfo.find(t => t.id === 'javascript');
const highlighter = await createHighlighterCore({
- engine: createOnigurumaEngine(() => import('shiki/onig.wasm?init')),
+ engine: createJavaScriptRegexEngine({ forgiving: true }),
themes,
langs: [
...(jsLangInfo ? [async () => await jsLangInfo.import()] : []),
diff --git a/packages/frontend/src/utility/drive.ts b/packages/frontend/src/utility/drive.ts
new file mode 100644
index 0000000000..de473c9b11
--- /dev/null
+++ b/packages/frontend/src/utility/drive.ts
@@ -0,0 +1,299 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { defineAsyncComponent } from 'vue';
+import * as Misskey from 'misskey-js';
+import { apiUrl } from '@@/js/config.js';
+import * as os from '@/os.js';
+import { misskeyApi } from '@/utility/misskey-api.js';
+import { useStream } from '@/stream.js';
+import { i18n } from '@/i18n.js';
+import { prefer } from '@/preferences.js';
+import { $i } from '@/i.js';
+import { instance } from '@/instance.js';
+import { globalEvents } from '@/events.js';
+import { getProxiedImageUrl } from '@/utility/media-proxy.js';
+
+type UploadReturnType = {
+ filePromise: Promise;
+ abort: () => void;
+};
+
+export class UploadAbortedError extends Error {
+ constructor() {
+ super('Upload aborted');
+ }
+}
+
+export function uploadFile(file: File | Blob, options: {
+ name?: string;
+ folderId?: string | null;
+ onProgress?: (ctx: { total: number; loaded: number; }) => void;
+} = {}): UploadReturnType {
+ const xhr = new XMLHttpRequest();
+ const abortController = new AbortController();
+ const { signal } = abortController;
+
+ const filePromise = new Promise((resolve, reject) => {
+ if ($i == null) return reject();
+
+ const allowedMimeTypes = $i.policies.uploadableFileTypes;
+ const isAllowedMimeType = allowedMimeTypes.some(mimeType => {
+ if (mimeType === '*' || mimeType === '*/*') return true;
+ if (mimeType.endsWith('/*')) return file.type.startsWith(mimeType.slice(0, -1));
+ return file.type === mimeType;
+ });
+ if (!isAllowedMimeType) {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: i18n.ts.cannotUploadBecauseUnallowedFileType,
+ });
+ return reject();
+ }
+
+ if ((file.size > instance.maxFileSize) || (file.size > ($i.policies.maxFileSizeMb * 1024 * 1024))) {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
+ });
+ return reject();
+ }
+
+ signal.addEventListener('abort', () => {
+ reject(new UploadAbortedError());
+ }, { once: true });
+
+ xhr.open('POST', apiUrl + '/drive/files/create', true);
+ xhr.onload = ((ev: ProgressEvent) => {
+ if (xhr.status !== 200 || ev.target == null || ev.target.response == null) {
+ if (xhr.status === 413) {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
+ });
+ } else if (ev.target?.response) {
+ const res = JSON.parse(ev.target.response);
+ if (res.error?.id === 'bec5bd69-fba3-43c9-b4fb-2894b66ad5d2') {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: i18n.ts.cannotUploadBecauseInappropriate,
+ });
+ } else if (res.error?.id === 'd08dbc37-a6a9-463a-8c47-96c32ab5f064') {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: i18n.ts.cannotUploadBecauseNoFreeSpace,
+ });
+ } else if (res.error?.id === '4becd248-7f2c-48c4-a9f0-75edc4f9a1ea') {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: i18n.ts.cannotUploadBecauseUnallowedFileType,
+ });
+ } else {
+ os.alert({
+ type: 'error',
+ title: i18n.ts.failedToUpload,
+ text: `${res.error?.message}\n${res.error?.code}\n${res.error?.id}`,
+ });
+ }
+ } else {
+ os.alert({
+ type: 'error',
+ title: 'Failed to upload',
+ text: `${JSON.stringify(ev.target?.response)}, ${JSON.stringify(xhr.response)}`,
+ });
+ }
+
+ reject();
+ return;
+ }
+
+ const driveFile = JSON.parse(ev.target.response);
+ globalEvents.emit('driveFileCreated', driveFile);
+ resolve(driveFile);
+ }) as (ev: ProgressEvent) => any;
+
+ if (options.onProgress) {
+ xhr.upload.onprogress = ev => {
+ if (ev.lengthComputable && options.onProgress != null) {
+ options.onProgress({
+ total: ev.total,
+ loaded: ev.loaded,
+ });
+ }
+ };
+ }
+
+ const formData = new FormData();
+ formData.append('i', $i.token);
+ formData.append('force', 'true');
+ formData.append('file', file);
+ formData.append('name', options.name ?? (file instanceof File ? file.name : 'untitled'));
+ if (options.folderId) formData.append('folderId', options.folderId);
+
+ xhr.send(formData);
+ });
+
+ const abort = () => {
+ xhr.abort();
+ abortController.abort();
+ };
+
+ return { filePromise, abort };
+}
+
+export function chooseFileFromPcAndUpload(
+ options: {
+ multiple?: boolean;
+ folderId?: string | null;
+ } = {},
+): Promise {
+ return new Promise((res, rej) => {
+ os.chooseFileFromPc({ multiple: options.multiple }).then(files => {
+ if (files.length === 0) return;
+ os.launchUploader(files, {
+ folderId: options.folderId,
+ }).then(driveFiles => {
+ res(driveFiles);
+ });
+ });
+ });
+}
+
+export function chooseDriveFile(options: {
+ multiple?: boolean;
+} = {}): Promise {
+ return new Promise(resolve => {
+ const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkDriveFileSelectDialog.vue')), {
+ multiple: options.multiple ?? false,
+ }, {
+ done: files => {
+ if (files) {
+ resolve(files);
+ }
+ },
+ closed: () => dispose(),
+ });
+ });
+}
+
+export function chooseFileFromUrl(): Promise {
+ return new Promise((res, rej) => {
+ os.inputText({
+ title: i18n.ts.uploadFromUrl,
+ type: 'url',
+ placeholder: i18n.ts.uploadFromUrlDescription,
+ }).then(({ canceled, result: url }) => {
+ if (canceled) return;
+
+ const marker = Math.random().toString(); // TODO: UUIDとか使う
+
+ // TODO: no websocketモード対応
+ const connection = useStream().useChannel('main');
+ connection.on('urlUploadFinished', urlResponse => {
+ if (urlResponse.marker === marker) {
+ res(urlResponse.file);
+ connection.dispose();
+ }
+ });
+
+ misskeyApi('drive/files/upload-from-url', {
+ url: url,
+ folderId: prefer.s.uploadFolder,
+ marker,
+ });
+
+ os.alert({
+ title: i18n.ts.uploadFromUrlRequested,
+ text: i18n.ts.uploadFromUrlMayTakeTime,
+ });
+ });
+ });
+}
+
+function select(anchorElement: HTMLElement | EventTarget | null, label: string | null, multiple: boolean): Promise {
+ return new Promise((res, rej) => {
+ os.popupMenu([label ? {
+ text: label,
+ type: 'label',
+ } : undefined, {
+ text: i18n.ts.upload,
+ icon: 'ti ti-upload',
+ action: () => chooseFileFromPcAndUpload({ multiple }).then(files => res(files)),
+ }, {
+ text: i18n.ts.fromDrive,
+ icon: 'ti ti-cloud',
+ action: () => chooseDriveFile({ multiple }).then(files => res(files)),
+ }, {
+ text: i18n.ts.fromUrl,
+ icon: 'ti ti-link',
+ action: () => chooseFileFromUrl().then(file => res([file])),
+ }], anchorElement);
+ });
+}
+
+export function selectFile(anchorElement: HTMLElement | EventTarget | null, label: string | null = null): Promise {
+ return select(anchorElement, label, false).then(files => files[0]);
+}
+
+export function selectFiles(anchorElement: HTMLElement | EventTarget | null, label: string | null = null): Promise {
+ return select(anchorElement, label, true);
+}
+
+export async function createCroppedImageDriveFileFromImageDriveFile(imageDriveFile: Misskey.entities.DriveFile, options: {
+ aspectRatio: number | null;
+}): Promise {
+ return new Promise((resolve, reject) => {
+ const imgUrl = getProxiedImageUrl(imageDriveFile.url, undefined, true);
+ const image = new Image();
+ image.src = imgUrl;
+ image.onload = () => {
+ const canvas = window.document.createElement('canvas');
+ const ctx = canvas.getContext('2d')!;
+ canvas.width = image.width;
+ canvas.height = image.height;
+ ctx.drawImage(image, 0, 0);
+ canvas.toBlob(blob => {
+ if (blob == null) {
+ reject();
+ return;
+ }
+
+ os.cropImageFile(blob, {
+ aspectRatio: options.aspectRatio,
+ }).then(croppedImageFile => {
+ const { filePromise } = uploadFile(croppedImageFile, {
+ name: imageDriveFile.name,
+ folderId: imageDriveFile.folderId,
+ });
+
+ filePromise.then(driveFile => {
+ resolve(driveFile);
+ });
+ });
+ });
+ };
+ });
+}
+
+export async function selectDriveFolder(initialFolder: Misskey.entities.DriveFolder['id'] | null): Promise {
+ return new Promise(resolve => {
+ const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkDriveFolderSelectDialog.vue')), {
+ initialFolder,
+ }, {
+ done: folders => {
+ if (folders) {
+ resolve(folders);
+ }
+ },
+ closed: () => dispose(),
+ });
+ });
+}
diff --git a/packages/frontend/src/utility/emoji-mute.ts b/packages/frontend/src/utility/emoji-mute.ts
new file mode 100644
index 0000000000..a058bcc242
--- /dev/null
+++ b/packages/frontend/src/utility/emoji-mute.ts
@@ -0,0 +1,61 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { computed } from 'vue';
+import { prefer } from '@/preferences.js';
+
+// custom絵文字の情報からキーを作成する
+export function makeEmojiMuteKey(props: { name: string; host?: string | null }) {
+ return props.name.startsWith(':') ? props.name : `:${props.name}${props.host ? `@${props.host}` : ''}:`;
+}
+
+export function extractCustomEmojiName (name:string) {
+ return (name[0] === ':' ? name.substring(1, name.length - 1) : name).replace('@.', '').split('@')[0];
+}
+
+export function extractCustomEmojiHost (name:string) {
+ // nameは:emojiName@host:の形式
+ // 取り出したい部分はhostなので、@以降を取り出す
+ const index = name.indexOf('@');
+ if (index === -1) {
+ return null;
+ }
+ const host = name.substring(index + 1, name.length - 1);
+ if (host === '' || host === '.') {
+ return null;
+ }
+ return host;
+}
+
+export function mute(emoji: string) {
+ const isCustomEmoji = emoji.startsWith(':') && emoji.endsWith(':');
+ const emojiMuteKey = isCustomEmoji ?
+ makeEmojiMuteKey({ name: extractCustomEmojiName(emoji), host: extractCustomEmojiHost(emoji) }) :
+ emoji;
+ const mutedEmojis = prefer.r.mutingEmojis.value;
+ if (!mutedEmojis.includes(emojiMuteKey)) {
+ return prefer.commit('mutingEmojis', [...mutedEmojis, emojiMuteKey]);
+ }
+ throw new Error('Emoji is already muted', { cause: `${emojiMuteKey} is Already Muted` });
+}
+
+export function unmute(emoji:string) {
+ const isCustomEmoji = emoji.startsWith(':') && emoji.endsWith(':');
+ const emojiMuteKey = isCustomEmoji ?
+ makeEmojiMuteKey({ name: extractCustomEmojiName(emoji), host: extractCustomEmojiHost(emoji) }) :
+ emoji;
+ const mutedEmojis = prefer.r.mutingEmojis.value;
+ console.log('unmute', emoji, emojiMuteKey);
+ console.log('mutedEmojis', mutedEmojis);
+ prefer.commit('mutingEmojis', mutedEmojis.filter((e) => e !== emojiMuteKey));
+}
+
+export function checkMuted(emoji: string) {
+ const isCustomEmoji = emoji.startsWith(':') && emoji.endsWith(':');
+ const emojiMuteKey = isCustomEmoji ?
+ makeEmojiMuteKey({ name: extractCustomEmojiName(emoji), host: extractCustomEmojiHost(emoji) }) :
+ emoji;
+ return computed(() => prefer.r.mutingEmojis.value.includes(emojiMuteKey));
+}
diff --git a/packages/frontend/src/utility/emoji-picker.ts b/packages/frontend/src/utility/emoji-picker.ts
index 6279786b2d..c663776de3 100644
--- a/packages/frontend/src/utility/emoji-picker.ts
+++ b/packages/frontend/src/utility/emoji-picker.ts
@@ -15,7 +15,7 @@ import { prefer } from '@/preferences.js';
* 一度表示したダイアログを連続で使用できることが望ましいシーンでの利用が想定される。
*/
class EmojiPicker {
- private src: Ref = ref(null);
+ private anchorElement: Ref = ref(null);
private manualShowing = ref(false);
private onChosen?: (emoji: string) => void;
private onClosed?: () => void;
@@ -34,7 +34,7 @@ class EmojiPicker {
});
await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
- src: this.src,
+ anchorElement: this.anchorElement,
pinnedEmojis: emojisRef,
asReactionPicker: false,
manualShowing: this.manualShowing,
@@ -47,18 +47,18 @@ class EmojiPicker {
this.manualShowing.value = false;
},
closed: () => {
- this.src.value = null;
+ this.anchorElement.value = null;
if (this.onClosed) this.onClosed();
},
});
}
public show(
- src: HTMLElement,
+ anchorElement: HTMLElement,
onChosen?: EmojiPicker['onChosen'],
onClosed?: EmojiPicker['onClosed'],
) {
- this.src.value = src;
+ this.anchorElement.value = anchorElement;
this.manualShowing.value = true;
this.onChosen = onChosen;
this.onClosed = onClosed;
diff --git a/packages/frontend/src/utility/get-drive-file-menu.ts b/packages/frontend/src/utility/get-drive-file-menu.ts
index 3c6cbba002..4b4bab3125 100644
--- a/packages/frontend/src/utility/get-drive-file-menu.ts
+++ b/packages/frontend/src/utility/get-drive-file-menu.ts
@@ -5,12 +5,14 @@
import * as Misskey from 'misskey-js';
import { defineAsyncComponent } from 'vue';
+import { selectDriveFolder } from './drive.js';
import type { MenuItem } from '@/types/menu.js';
import { i18n } from '@/i18n.js';
import { copyToClipboard } from '@/utility/copy-to-clipboard.js';
import * as os from '@/os.js';
import { misskeyApi } from '@/utility/misskey-api.js';
import { prefer } from '@/preferences.js';
+import { globalEvents } from '@/events.js';
function rename(file: Misskey.entities.DriveFile) {
os.inputText({
@@ -42,7 +44,7 @@ function describe(file: Misskey.entities.DriveFile) {
}
function move(file: Misskey.entities.DriveFile) {
- os.selectDriveFolder(false).then(folder => {
+ selectDriveFolder(null).then(folder => {
misskeyApi('drive/files/update', {
fileId: file.id,
folderId: folder[0] ? folder[0].id : null,
@@ -77,11 +79,13 @@ async function deleteFile(file: Misskey.entities.DriveFile) {
type: 'warning',
text: i18n.tsx.driveFileDeleteConfirm({ name: file.name }),
});
-
if (canceled) return;
- misskeyApi('drive/files/delete', {
+
+ await os.apiWithDialog('drive/files/delete', {
fileId: file.id,
});
+
+ globalEvents.emit('driveFilesDeleted', [file]);
}
export function getDriveFileMenu(file: Misskey.entities.DriveFile, folder?: Misskey.entities.DriveFolder | null): MenuItem[] {
@@ -112,17 +116,6 @@ export function getDriveFileMenu(file: Misskey.entities.DriveFile, folder?: Miss
action: () => describe(file),
});
- if (isImage) {
- menuItems.push({
- text: i18n.ts.cropImage,
- icon: 'ti ti-crop',
- action: () => os.cropImage(file, {
- aspectRatio: NaN,
- uploadFolder: folder ? folder.id : folder,
- }),
- });
- }
-
menuItems.push({ type: 'divider' }, {
text: i18n.ts.createNoteFromTheFile,
icon: 'ti ti-pencil',
diff --git a/packages/frontend/src/utility/upload/isWebpSupported.ts b/packages/frontend/src/utility/isWebpSupported.ts
similarity index 100%
rename from packages/frontend/src/utility/upload/isWebpSupported.ts
rename to packages/frontend/src/utility/isWebpSupported.ts
diff --git a/packages/frontend/src/utility/mfm-function-picker.ts b/packages/frontend/src/utility/mfm-function-picker.ts
index a2f777f623..09802d580b 100644
--- a/packages/frontend/src/utility/mfm-function-picker.ts
+++ b/packages/frontend/src/utility/mfm-function-picker.ts
@@ -4,20 +4,20 @@
*/
import { nextTick } from 'vue';
+import { MFM_TAGS } from '@@/js/const.js';
import type { Ref } from 'vue';
+import type { MenuItem } from '@/types/menu.js';
import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
-import { MFM_TAGS } from '@@/js/const.js';
-import type { MenuItem } from '@/types/menu.js';
/**
* MFMの装飾のリストを表示する
*/
-export function mfmFunctionPicker(src: HTMLElement | EventTarget | null, textArea: HTMLInputElement | HTMLTextAreaElement, textRef: Ref) {
+export function mfmFunctionPicker(anchorElement: HTMLElement | EventTarget | null, textArea: HTMLInputElement | HTMLTextAreaElement, textRef: Ref) {
os.popupMenu([{
text: i18n.ts.addMfmFunction,
type: 'label',
- }, ...getFunctionList(textArea, textRef)], src);
+ }, ...getFunctionList(textArea, textRef)], anchorElement);
}
function getFunctionList(textArea: HTMLInputElement | HTMLTextAreaElement, textRef: Ref): MenuItem[] {
diff --git a/packages/frontend/src/utility/popup-position.ts b/packages/frontend/src/utility/popup-position.ts
index 3dad41a8b3..676dfb7507 100644
--- a/packages/frontend/src/utility/popup-position.ts
+++ b/packages/frontend/src/utility/popup-position.ts
@@ -39,6 +39,10 @@ export function calcPopupPosition(el: HTMLElement, props: {
left = window.innerWidth - contentWidth + window.scrollX - 1;
}
+ if (left < window.scrollX) {
+ left = window.scrollX;
+ }
+
return [left, top];
};
@@ -60,6 +64,10 @@ export function calcPopupPosition(el: HTMLElement, props: {
left = window.innerWidth - contentWidth + window.scrollX - 1;
}
+ if (left < window.scrollX) {
+ left = window.scrollX;
+ }
+
return [left, top];
};
@@ -81,6 +89,10 @@ export function calcPopupPosition(el: HTMLElement, props: {
top = window.innerHeight - contentHeight + window.scrollY - 1;
}
+ if (left < window.scrollX) {
+ left = window.scrollX;
+ }
+
return [left, top];
};
@@ -110,6 +122,10 @@ export function calcPopupPosition(el: HTMLElement, props: {
top = window.innerHeight - contentHeight + window.scrollY - 1;
}
+ if (left < window.scrollX) {
+ left = window.scrollX;
+ }
+
return [left, top];
};
diff --git a/packages/frontend/src/utility/reaction-picker.ts b/packages/frontend/src/utility/reaction-picker.ts
index 7c159fa2da..e33346101d 100644
--- a/packages/frontend/src/utility/reaction-picker.ts
+++ b/packages/frontend/src/utility/reaction-picker.ts
@@ -10,7 +10,7 @@ import { popup } from '@/os.js';
import { prefer } from '@/preferences.js';
class ReactionPicker {
- private src: Ref = ref(null);
+ private anchorElement: Ref = ref(null);
private manualShowing = ref(false);
private targetNote: Ref = ref(null);
private onChosen?: (reaction: string) => void;
@@ -30,7 +30,7 @@ class ReactionPicker {
});
await popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
- src: this.src,
+ anchorElement: this.anchorElement,
pinnedEmojis: reactionsRef,
asReactionPicker: true,
targetNote: this.targetNote,
@@ -43,14 +43,14 @@ class ReactionPicker {
this.manualShowing.value = false;
},
closed: () => {
- this.src.value = null;
+ this.anchorElement.value = null;
if (this.onClosed) this.onClosed();
},
});
}
- public show(src: HTMLElement | null, targetNote: Misskey.entities.Note | null, onChosen?: ReactionPicker['onChosen'], onClosed?: ReactionPicker['onClosed']) {
- this.src.value = src;
+ public show(anchorElement: HTMLElement | null, targetNote: Misskey.entities.Note | null, onChosen?: ReactionPicker['onChosen'], onClosed?: ReactionPicker['onClosed']) {
+ this.anchorElement.value = anchorElement;
this.targetNote.value = targetNote;
this.manualShowing.value = true;
this.onChosen = onChosen;
diff --git a/packages/frontend/src/utility/select-file.ts b/packages/frontend/src/utility/select-file.ts
deleted file mode 100644
index 731ef58302..0000000000
--- a/packages/frontend/src/utility/select-file.ts
+++ /dev/null
@@ -1,128 +0,0 @@
-/*
- * SPDX-FileCopyrightText: syuilo and misskey-project
- * SPDX-License-Identifier: AGPL-3.0-only
- */
-
-import { ref } from 'vue';
-import * as Misskey from 'misskey-js';
-import * as os from '@/os.js';
-import { misskeyApi } from '@/utility/misskey-api.js';
-import { useStream } from '@/stream.js';
-import { i18n } from '@/i18n.js';
-import { uploadFile } from '@/utility/upload.js';
-import { prefer } from '@/preferences.js';
-
-export function chooseFileFromPc(
- multiple: boolean,
- options?: {
- uploadFolder?: string | null;
- keepOriginal?: boolean;
- nameConverter?: (file: File) => string | undefined;
- },
-): Promise {
- const uploadFolder = options?.uploadFolder ?? prefer.s.uploadFolder;
- const keepOriginal = options?.keepOriginal ?? false;
- const nameConverter = options?.nameConverter ?? (() => undefined);
-
- return new Promise((res, rej) => {
- const input = window.document.createElement('input');
- input.type = 'file';
- input.multiple = multiple;
- input.onchange = () => {
- if (!input.files) return res([]);
- const promises = Array.from(
- input.files,
- file => uploadFile(file, uploadFolder, nameConverter(file), keepOriginal),
- );
-
- Promise.all(promises).then(driveFiles => {
- res(driveFiles);
- }).catch(err => {
- // アップロードのエラーは uploadFile 内でハンドリングされているためアラートダイアログを出したりはしてはいけない
- });
-
- // 一応廃棄
- (window as any).__misskey_input_ref__ = null;
- };
-
- // https://qiita.com/fukasawah/items/b9dc732d95d99551013d
- // iOS Safari で正常に動かす為のおまじない
- (window as any).__misskey_input_ref__ = input;
-
- input.click();
- });
-}
-
-export function chooseFileFromDrive(multiple: boolean): Promise {
- return new Promise((res, rej) => {
- os.selectDriveFile(multiple).then(files => {
- res(files);
- });
- });
-}
-
-export function chooseFileFromUrl(): Promise {
- return new Promise((res, rej) => {
- os.inputText({
- title: i18n.ts.uploadFromUrl,
- type: 'url',
- placeholder: i18n.ts.uploadFromUrlDescription,
- }).then(({ canceled, result: url }) => {
- if (canceled) return;
-
- const marker = Math.random().toString(); // TODO: UUIDとか使う
-
- const connection = useStream().useChannel('main');
- connection.on('urlUploadFinished', urlResponse => {
- if (urlResponse.marker === marker) {
- res(urlResponse.file);
- connection.dispose();
- }
- });
-
- misskeyApi('drive/files/upload-from-url', {
- url: url,
- folderId: prefer.s.uploadFolder,
- marker,
- });
-
- os.alert({
- title: i18n.ts.uploadFromUrlRequested,
- text: i18n.ts.uploadFromUrlMayTakeTime,
- });
- });
- });
-}
-
-function select(src: HTMLElement | EventTarget | null, label: string | null, multiple: boolean): Promise {
- return new Promise((res, rej) => {
- os.popupMenu([label ? {
- text: label,
- type: 'label',
- } : undefined, {
- text: i18n.ts.upload + ' (' + i18n.ts.compress + ')',
- icon: 'ti ti-upload',
- action: () => chooseFileFromPc(multiple, { keepOriginal: false }).then(files => res(files)),
- }, {
- text: i18n.ts.upload,
- icon: 'ti ti-upload',
- action: () => chooseFileFromPc(multiple, { keepOriginal: true }).then(files => res(files)),
- }, {
- text: i18n.ts.fromDrive,
- icon: 'ti ti-cloud',
- action: () => chooseFileFromDrive(multiple).then(files => res(files)),
- }, {
- text: i18n.ts.fromUrl,
- icon: 'ti ti-link',
- action: () => chooseFileFromUrl().then(file => res([file])),
- }], src);
- });
-}
-
-export function selectFile(src: HTMLElement | EventTarget | null, label: string | null = null): Promise {
- return select(src, label, false).then(files => files[0]);
-}
-
-export function selectFiles(src: HTMLElement | EventTarget | null, label: string | null = null): Promise {
- return select(src, label, true);
-}
diff --git a/packages/frontend/src/utility/sound.ts b/packages/frontend/src/utility/sound.ts
index d3f82a37f2..217da9c8b2 100644
--- a/packages/frontend/src/utility/sound.ts
+++ b/packages/frontend/src/utility/sound.ts
@@ -133,7 +133,7 @@ export function playMisskeySfx(operationType: OperationType) {
playMisskeySfxFile(sound).then((succeed) => {
if (!succeed && sound.type === '_driveFile_') {
// ドライブファイルが存在しない場合はデフォルトのサウンドを再生する
- const soundName = PREF_DEF[`sound_${operationType}`].default.type as Exclude;
+ const soundName = PREF_DEF[`sound.on.${operationType}`].default.type as Exclude;
if (_DEV_) console.log(`Failed to play sound: ${sound.fileUrl}, so play default sound: ${soundName}`);
playMisskeySfxFileInternal({
type: soundName,
diff --git a/packages/frontend/src/utility/timeline-date-separate.ts b/packages/frontend/src/utility/timeline-date-separate.ts
index 1071a80962..33ddea048b 100644
--- a/packages/frontend/src/utility/timeline-date-separate.ts
+++ b/packages/frontend/src/utility/timeline-date-separate.ts
@@ -4,7 +4,7 @@
*/
import { computed } from 'vue';
-import type { Ref } from 'vue';
+import type { Ref, ShallowRef } from 'vue';
export function getDateText(dateInstance: Date) {
const date = dateInstance.getDate();
@@ -12,19 +12,6 @@ export function getDateText(dateInstance: Date) {
return `${month.toString()}/${date.toString()}`;
}
-export type DateSeparetedTimelineItem = {
- id: string;
- type: 'item';
- data: T;
-} | {
- id: string;
- type: 'date';
- prev: Date;
- prevText: string;
- next: Date;
- nextText: string;
-};
-
// TODO: いちいちDateインスタンス作成するのは無駄感あるから文字列のまま解析したい
export function isSeparatorNeeded(
prev: string | null,
@@ -56,7 +43,20 @@ export function getSeparatorInfo(
};
}
-export function makeDateSeparatedTimelineComputedRef(items: Ref) {
+export type DateSeparetedTimelineItem = {
+ id: string;
+ type: 'item';
+ data: T;
+} | {
+ id: string;
+ type: 'date';
+ prev: Date;
+ prevText: string;
+ next: Date;
+ nextText: string;
+};
+
+export function makeDateSeparatedTimelineComputedRef(items: Ref | ShallowRef) {
return computed[]>(() => {
const tl: DateSeparetedTimelineItem[] = [];
for (let i = 0; i < items.value.length; i++) {
@@ -92,3 +92,35 @@ export function makeDateSeparatedTimelineComputedRef = {
+ date: Date;
+ items: T[];
+};
+
+export function makeDateGroupedTimelineComputedRef(items: Ref | ShallowRef, span: 'day' | 'month' = 'day') {
+ return computed[]>(() => {
+ const tl: DateGroupedTimelineItem[] = [];
+ for (let i = 0; i < items.value.length; i++) {
+ const item = items.value[i];
+ const date = new Date(item.createdAt);
+ const nextDate = items.value[i + 1] ? new Date(items.value[i + 1].createdAt) : null;
+
+ if (tl.length === 0 || (
+ span === 'day' && tl[tl.length - 1].date.getTime() !== date.getTime()
+ ) || (
+ span === 'month' && (
+ tl[tl.length - 1].date.getFullYear() !== date.getFullYear() ||
+ tl[tl.length - 1].date.getMonth() !== date.getMonth()
+ )
+ )) {
+ tl.push({
+ date,
+ items: [],
+ });
+ }
+ tl[tl.length - 1].items.push(item);
+ }
+ return tl;
+ });
+}
diff --git a/packages/frontend/src/utility/upload.ts b/packages/frontend/src/utility/upload.ts
deleted file mode 100644
index 03240749e9..0000000000
--- a/packages/frontend/src/utility/upload.ts
+++ /dev/null
@@ -1,162 +0,0 @@
-/*
- * SPDX-FileCopyrightText: syuilo and misskey-project
- * SPDX-License-Identifier: AGPL-3.0-only
- */
-
-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 { apiUrl } from '@@/js/config.js';
-import { getCompressionConfig } from './upload/compress-config.js';
-import { $i } from '@/i.js';
-import { alert } from '@/os.js';
-import { i18n } from '@/i18n.js';
-import { instance } from '@/instance.js';
-import { prefer } from '@/preferences.js';
-
-type Uploading = {
- id: string;
- name: string;
- progressMax: number | undefined;
- progressValue: number | undefined;
- img: string;
-};
-export const uploads = ref([]);
-
-const mimeTypeMap = {
- 'image/webp': 'webp',
- 'image/jpeg': 'jpg',
- 'image/png': 'png',
-} as const;
-
-export function uploadFile(
- file: File,
- folder?: string | Misskey.entities.DriveFolder | null,
- name?: string,
- keepOriginal = false,
-): Promise {
- if ($i == null) throw new Error('Not logged in');
-
- const _folder = typeof folder === 'string' ? folder : folder?.id;
-
- if ((file.size > instance.maxFileSize) || (file.size > ($i.policies.maxFileSizeMb * 1024 * 1024))) {
- alert({
- type: 'error',
- title: i18n.ts.failedToUpload,
- text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
- });
- return Promise.reject();
- }
-
- return new Promise((resolve, reject) => {
- 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,
- name: prefer.s.keepOriginalFilename ? filename : id + extension,
- progressMax: undefined,
- progressValue: undefined,
- img: window.URL.createObjectURL(file),
- });
-
- uploads.value.push(ctx);
-
- const config = !keepOriginal ? await getCompressionConfig(file) : undefined;
- let resizedImage: Blob | undefined;
- if (config) {
- try {
- const resized = await readAndCompressImage(file, config);
- if (resized.size < file.size || file.type === 'image/webp') {
- // The compression may not always reduce the file size
- // (and WebP is not browser safe yet)
- resizedImage = resized;
- }
- if (_DEV_) {
- const saved = ((1 - resized.size / file.size) * 100).toFixed(2);
- console.log(`Image compression: before ${file.size} bytes, after ${resized.size} bytes, saved ${saved}%`);
- }
-
- ctx.name = file.type !== config.mimeType ? `${ctx.name}.${mimeTypeMap[config.mimeType]}` : ctx.name;
- } catch (err) {
- console.error('Failed to resize image', err);
- }
- }
-
- const formData = new FormData();
- formData.append('i', $i!.token);
- formData.append('force', 'true');
- formData.append('file', resizedImage ?? file);
- formData.append('name', ctx.name);
- if (_folder) formData.append('folderId', _folder);
-
- const xhr = new XMLHttpRequest();
- xhr.open('POST', apiUrl + '/drive/files/create', true);
- xhr.onload = ((ev: ProgressEvent) => {
- if (xhr.status !== 200 || ev.target == null || ev.target.response == null) {
- // TODO: 消すのではなくて(ネットワーク的なエラーなら)再送できるようにしたい
- uploads.value = uploads.value.filter(x => x.id !== id);
-
- if (xhr.status === 413) {
- alert({
- type: 'error',
- title: i18n.ts.failedToUpload,
- text: i18n.ts.cannotUploadBecauseExceedsFileSizeLimit,
- });
- } else if (ev.target?.response) {
- const res = JSON.parse(ev.target.response);
- if (res.error?.id === 'bec5bd69-fba3-43c9-b4fb-2894b66ad5d2') {
- alert({
- type: 'error',
- title: i18n.ts.failedToUpload,
- text: i18n.ts.cannotUploadBecauseInappropriate,
- });
- } else if (res.error?.id === 'd08dbc37-a6a9-463a-8c47-96c32ab5f064') {
- alert({
- type: 'error',
- title: i18n.ts.failedToUpload,
- text: i18n.ts.cannotUploadBecauseNoFreeSpace,
- });
- } else {
- alert({
- type: 'error',
- title: i18n.ts.failedToUpload,
- text: `${res.error?.message}\n${res.error?.code}\n${res.error?.id}`,
- });
- }
- } else {
- alert({
- type: 'error',
- title: 'Failed to upload',
- text: `${JSON.stringify(ev.target?.response)}, ${JSON.stringify(xhr.response)}`,
- });
- }
-
- reject();
- return;
- }
-
- const driveFile = JSON.parse(ev.target.response);
-
- resolve(driveFile);
-
- uploads.value = uploads.value.filter(x => x.id !== id);
- }) as (ev: ProgressEvent) => any;
-
- xhr.upload.onprogress = ev => {
- if (ev.lengthComputable) {
- ctx.progressMax = ev.total;
- ctx.progressValue = ev.loaded;
- }
- };
-
- xhr.send(formData);
- };
- reader.readAsArrayBuffer(file);
- });
-}
diff --git a/packages/frontend/src/utility/upload/compress-config.ts b/packages/frontend/src/utility/upload/compress-config.ts
deleted file mode 100644
index 3046b7f518..0000000000
--- a/packages/frontend/src/utility/upload/compress-config.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-/*
- * SPDX-FileCopyrightText: syuilo and misskey-project
- * SPDX-License-Identifier: AGPL-3.0-only
- */
-
-import isAnimated from 'is-file-animated';
-import { isWebpSupported } from './isWebpSupported.js';
-import type { BrowserImageResizerConfigWithConvertedOutput } from '@misskey-dev/browser-image-resizer';
-
-const compressTypeMap = {
- 'image/jpeg': { quality: 0.90, mimeType: 'image/webp' },
- 'image/png': { quality: 1, mimeType: 'image/webp' },
- 'image/webp': { quality: 0.90, mimeType: 'image/webp' },
- 'image/svg+xml': { quality: 1, mimeType: 'image/webp' },
-} as const;
-
-const compressTypeMapFallback = {
- 'image/jpeg': { quality: 0.85, mimeType: 'image/jpeg' },
- 'image/png': { quality: 1, mimeType: 'image/png' },
- 'image/webp': { quality: 0.85, mimeType: 'image/jpeg' },
- 'image/svg+xml': { quality: 1, mimeType: 'image/png' },
-} as const;
-
-export async function getCompressionConfig(file: File): Promise {
- const imgConfig = (isWebpSupported() ? compressTypeMap : compressTypeMapFallback)[file.type];
- if (!imgConfig || await isAnimated(file)) {
- return;
- }
-
- return {
- maxWidth: 2048,
- maxHeight: 2048,
- debug: true,
- ...imgConfig,
- };
-}
diff --git a/packages/frontend/src/utility/player-url-transform.ts b/packages/frontend/src/utility/url-preview.ts
similarity index 76%
rename from packages/frontend/src/utility/player-url-transform.ts
rename to packages/frontend/src/utility/url-preview.ts
index 39c6df6500..e7379f4202 100644
--- a/packages/frontend/src/utility/player-url-transform.ts
+++ b/packages/frontend/src/utility/url-preview.ts
@@ -2,7 +2,12 @@
* SPDX-FileCopyrightText: syuilo and misskey-project
* SPDX-License-Identifier: AGPL-3.0-only
*/
+import { computed } from 'vue';
import { hostname } from '@@/js/config.js';
+import { instance } from '@/instance.js';
+import { prefer } from '@/preferences.js';
+
+export const isEnabledUrlPreview = computed(() => (instance.enableUrlPreview && !prefer.r.dataSaver.value.disableUrlPreview));
export function transformPlayerUrl(url: string): string {
const urlObj = new URL(url);
diff --git a/packages/frontend/src/widgets/WidgetRssTicker.vue b/packages/frontend/src/widgets/WidgetRssTicker.vue
index b5be4d35c2..7fe7c6111a 100644
--- a/packages/frontend/src/widgets/WidgetRssTicker.vue
+++ b/packages/frontend/src/widgets/WidgetRssTicker.vue
@@ -15,11 +15,11 @@ SPDX-License-Identifier: AGPL-3.0-only
-
+
{{ item.title }}
-
+
@@ -31,7 +31,7 @@ import { ref, watch, computed } from 'vue';
import * as Misskey from 'misskey-js';
import { useWidgetPropsManager } from './widget.js';
import type { WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget.js';
-import MarqueeText from '@/components/MkMarquee.vue';
+import MarqueeText from '@/components/MkMarqueeText.vue';
import type { GetFormResultType } from '@/utility/form.js';
import MkContainer from '@/components/MkContainer.vue';
import { shuffle } from '@/utility/shuffle.js';
diff --git a/packages/frontend/src/widgets/WidgetSlideshow.vue b/packages/frontend/src/widgets/WidgetSlideshow.vue
index 2ccbb7a28f..3fe8cfa7e6 100644
--- a/packages/frontend/src/widgets/WidgetSlideshow.vue
+++ b/packages/frontend/src/widgets/WidgetSlideshow.vue
@@ -26,6 +26,7 @@ import type { GetFormResultType } from '@/utility/form.js';
import * as os from '@/os.js';
import { misskeyApi } from '@/utility/misskey-api.js';
import { i18n } from '@/i18n.js';
+import { selectDriveFolder } from '@/utility/drive.js';
const name = 'slideshow';
@@ -93,7 +94,7 @@ const fetch = () => {
};
const choose = () => {
- os.selectDriveFolder(false).then(folder => {
+ selectDriveFolder(null).then(folder => {
if (folder[0] == null) {
return;
}
diff --git a/packages/frontend/test/init.ts b/packages/frontend/test/init.ts
index 3b6b4d581b..e38338cf95 100644
--- a/packages/frontend/test/init.ts
+++ b/packages/frontend/test/init.ts
@@ -5,6 +5,8 @@
import { vi } from 'vitest';
import createFetchMock from 'vitest-fetch-mock';
+import type { Ref } from 'vue';
+import { ref } from 'vue';
const fetchMocker = createFetchMock(vi);
fetchMocker.enableMocks();
@@ -27,13 +29,24 @@ export const preferState: Record
diff --git a/packages/frontend/src/components/global/MkCustomEmoji.vue b/packages/frontend/src/components/global/MkCustomEmoji.vue
index dda45ceaa2..ed114d8d31 100644
--- a/packages/frontend/src/components/global/MkCustomEmoji.vue
+++ b/packages/frontend/src/components/global/MkCustomEmoji.vue
@@ -5,7 +5,16 @@ SPDX-License-Identifier: AGPL-3.0-only
+
();
const react = inject(DI.mfmEmojiReactCallback);
const customEmojiName = computed(() => (props.name[0] === ':' ? props.name.substring(1, props.name.length - 1) : props.name).replace('@.', ''));
const isLocal = computed(() => !props.host && (customEmojiName.value.endsWith('@.') || !customEmojiName.value.includes('@')));
+const emojiCodeToMute = makeEmojiMuteKey(props);
+const isMuted = checkEmojiMuted(emojiCodeToMute);
+const shouldMute = computed(() => !props.ignoreMuted && isMuted.value);
const rawUrl = computed(() => {
if (props.url) {
@@ -95,14 +109,18 @@ function onClick(ev: MouseEvent) {
menuItems.push({
type: 'label',
text: `:${props.name}:`,
- }, {
- text: i18n.ts.copy,
- icon: 'ti ti-copy',
- action: () => {
- copyToClipboard(`:${props.name}:`);
- },
});
+ if (isLocal.value) {
+ menuItems.push({
+ text: i18n.ts.copy,
+ icon: 'ti ti-copy',
+ action: () => {
+ copyToClipboard(`:${props.name}:`);
+ },
+ });
+ }
+
if (props.menuReaction && react) {
menuItems.push({
text: i18n.ts.doReaction,
@@ -113,21 +131,43 @@ function onClick(ev: MouseEvent) {
});
}
- menuItems.push({
- text: i18n.ts.info,
- icon: 'ti ti-info-circle',
- action: async () => {
- const { dispose } = os.popup(MkCustomEmojiDetailedDialog, {
- emoji: await misskeyApiGet('emoji', {
- name: customEmojiName.value,
- }),
- }, {
- closed: () => dispose(),
- });
- },
- });
+ if (isLocal.value) {
+ menuItems.push({
+ type: 'divider',
+ }, {
+ text: i18n.ts.info,
+ icon: 'ti ti-info-circle',
+ action: async () => {
+ const { dispose } = os.popup(MkCustomEmojiDetailedDialog, {
+ emoji: await misskeyApiGet('emoji', {
+ name: customEmojiName.value,
+ }),
+ }, {
+ closed: () => dispose(),
+ });
+ },
+ });
+ }
- if ($i?.isModerator ?? $i?.isAdmin) {
+ if (isMuted.value) {
+ menuItems.push({
+ text: i18n.ts.emojiUnmute,
+ icon: 'ti ti-mood-smile',
+ action: async () => {
+ await unmute();
+ },
+ });
+ } else {
+ menuItems.push({
+ text: i18n.ts.emojiMute,
+ icon: 'ti ti-mood-off',
+ action: async () => {
+ await mute();
+ },
+ });
+ }
+
+ if (($i?.isModerator ?? $i?.isAdmin) && isLocal.value) {
menuItems.push({
text: i18n.ts.edit,
icon: 'ti ti-pencil',
@@ -152,6 +192,36 @@ async function edit(name: string) {
});
}
+function mute() {
+ const titleEmojiName = isLocal.value
+ ? `:${customEmojiName.value}:`
+ : emojiCodeToMute;
+ os.confirm({
+ type: 'question',
+ title: i18n.tsx.muteX({ x: titleEmojiName }),
+ }).then(({ canceled }) => {
+ if (canceled) {
+ return;
+ }
+ muteEmoji(emojiCodeToMute);
+ });
+}
+
+function unmute() {
+ const titleEmojiName = isLocal.value
+ ? `:${customEmojiName.value}:`
+ : emojiCodeToMute;
+ os.confirm({
+ type: 'question',
+ title: i18n.tsx.unmuteX({ x: titleEmojiName }),
+ }).then(({ canceled }) => {
+ if (canceled) {
+ return;
+ }
+ unmuteEmoji(emojiCodeToMute);
+ });
+}
+
diff --git a/packages/frontend/src/components/global/MkUrl.vue b/packages/frontend/src/components/global/MkUrl.vue
index 2478b59f00..1da16b8923 100644
--- a/packages/frontend/src/components/global/MkUrl.vue
+++ b/packages/frontend/src/components/global/MkUrl.vue
@@ -30,7 +30,7 @@ import { toUnicode as decodePunycode } from 'punycode.js';
import { url as local } from '@@/js/config.js';
import * as os from '@/os.js';
import { useTooltip } from '@/composables/use-tooltip.js';
-import { isEnabledUrlPreview } from '@/instance.js';
+import { isEnabledUrlPreview } from '@/utility/url-preview.js';
import type { MkABehavior } from '@/components/global/MkA.vue';
import { maybeMakeRelative } from '@@/js/url.js';
diff --git a/packages/frontend/src/components/index.ts b/packages/frontend/src/components/index.ts
index 9981772ae8..19766e8575 100644
--- a/packages/frontend/src/components/index.ts
+++ b/packages/frontend/src/components/index.ts
@@ -26,6 +26,7 @@ import MkStickyContainer from './global/MkStickyContainer.vue';
import MkLazy from './global/MkLazy.vue';
import MkResult from './global/MkResult.vue';
import MkSystemIcon from './global/MkSystemIcon.vue';
+import MkTip from './global/MkTip.vue';
import PageWithHeader from './global/PageWithHeader.vue';
import PageWithAnimBg from './global/PageWithAnimBg.vue';
import SearchMarker from './global/SearchMarker.vue';
@@ -65,6 +66,7 @@ export const components = {
MkLazy: MkLazy,
MkResult: MkResult,
MkSystemIcon: MkSystemIcon,
+ MkTip: MkTip,
PageWithHeader: PageWithHeader,
PageWithAnimBg: PageWithAnimBg,
SearchMarker: SearchMarker,
@@ -98,6 +100,7 @@ declare module '@vue/runtime-core' {
MkLazy: typeof MkLazy;
MkResult: typeof MkResult;
MkSystemIcon: typeof MkSystemIcon;
+ MkTip: typeof MkTip;
PageWithHeader: typeof PageWithHeader;
PageWithAnimBg: typeof PageWithAnimBg;
SearchMarker: typeof SearchMarker;
diff --git a/packages/frontend/src/components/page/page.text.vue b/packages/frontend/src/components/page/page.text.vue
index 7702e250e4..a00eb0b5ca 100644
--- a/packages/frontend/src/components/page/page.text.vue
+++ b/packages/frontend/src/components/page/page.text.vue
@@ -17,7 +17,7 @@ import { defineAsyncComponent } from 'vue';
import * as mfm from 'mfm-js';
import * as Misskey from 'misskey-js';
import { extractUrlFromMfm } from '@/utility/extract-url-from-mfm.js';
-import { isEnabledUrlPreview } from '@/instance.js';
+import { isEnabledUrlPreview } from '@/utility/url-preview.js';
const MkUrlPreview = defineAsyncComponent(() => import('@/components/MkUrlPreview.vue'));
diff --git a/packages/frontend/src/composables/use-note-capture.ts b/packages/frontend/src/composables/use-note-capture.ts
index 2f33c25a0a..dd00c2b66e 100644
--- a/packages/frontend/src/composables/use-note-capture.ts
+++ b/packages/frontend/src/composables/use-note-capture.ts
@@ -191,7 +191,9 @@ export function useNoteCapture(props: {
note: Pick;
parentNote: Misskey.entities.Note | null;
$note: ReactiveNoteData;
-}) {
+}): {
+ subscribe: () => void;
+} {
const { note, parentNote, $note } = props;
noteEvents.on(`reacted:${note.id}`, onReacted);
@@ -254,6 +256,14 @@ export function useNoteCapture(props: {
$note.pollChoices = choices;
}
+ function subscribe() {
+ if ($i && store.s.realtimeMode) {
+ realtimeSubscribe(props);
+ } else {
+ pollingSubscribe(props);
+ }
+ }
+
onUnmounted(() => {
noteEvents.off(`reacted:${note.id}`, onReacted);
noteEvents.off(`unreacted:${note.id}`, onUnreacted);
@@ -265,19 +275,29 @@ export function useNoteCapture(props: {
// TODO: デバイスとサーバーの時計がズレていると不具合の元になるため、ズレを検知して警告を表示するなどのケアが必要かもしれない
if (parentNote == null) {
if ((Date.now() - new Date(note.createdAt).getTime()) > 1000 * 60 * 5) { // 5min
- // リノートで表示されているノートでもないし、投稿からある程度経過しているので購読しない
- return;
+ // リノートで表示されているノートでもないし、投稿からある程度経過しているので自動で購読しない
+ return {
+ subscribe: () => {
+ subscribe();
+ },
+ };
}
} else {
if ((Date.now() - new Date(parentNote.createdAt).getTime()) > 1000 * 60 * 5) { // 5min
- // リノートで表示されているノートだが、リノートされてからある程度経過しているので購読しない
- return;
+ // リノートで表示されているノートだが、リノートされてからある程度経過しているので自動で購読しない
+ return {
+ subscribe: () => {
+ subscribe();
+ },
+ };
}
}
- if ($i && store.s.realtimeMode) {
- realtimeSubscribe(props);
- } else {
- pollingSubscribe(props);
- }
+ subscribe();
+
+ return {
+ subscribe: () => {
+ // すでに購読しているので何もしない
+ },
+ };
}
diff --git a/packages/frontend/src/composables/use-pagination.ts b/packages/frontend/src/composables/use-pagination.ts
index f1042985bf..6a9f00bb91 100644
--- a/packages/frontend/src/composables/use-pagination.ts
+++ b/packages/frontend/src/composables/use-pagination.ts
@@ -35,10 +35,15 @@ export type PagingCtx(props: {
- ctx: PagingCtx;
+export function usePagination(props: {
+ ctx: PagingCtx;
+ autoInit?: boolean;
+ autoReInit?: boolean;
useShallowRef?: boolean;
}) {
const items = props.useShallowRef ? shallowRef([]) : ref([]);
@@ -49,8 +54,9 @@ export function usePagination(props: {
const canFetchOlder = ref(false);
const error = ref(false);
- // パラメータに何らかの変更があった際、再読込したい（チャンネル等のIDが変わったなど）
- watch(() => [props.ctx.endpoint, props.ctx.params], init, { deep: true });
+ if (props.autoReInit !== false) {
+ watch(() => [props.ctx.endpoint, props.ctx.params], init, { deep: true });
+ }
function getNewestId(): string | null | undefined {
// 様々な要因により並び順は保証されないのでソートが必要
@@ -92,12 +98,20 @@ export function usePagination(props: {
if (i === 3) item._shouldInsertAd_ = true;
}
- if (res.length === 0 || props.ctx.noPaging) {
- pushItems(res);
- canFetchOlder.value = false;
- } else {
- pushItems(res);
- canFetchOlder.value = true;
+ pushItems(res);
+
+ if (props.ctx.canFetchDetection === 'limit') {
+ if (res.length < FIRST_FETCH_LIMIT) {
+ canFetchOlder.value = false;
+ } else {
+ canFetchOlder.value = true;
+ }
+ } else if (props.ctx.canFetchDetection === 'safe' || props.ctx.canFetchDetection == null) {
+ if (res.length === 0 || props.ctx.noPaging) {
+ canFetchOlder.value = false;
+ } else {
+ canFetchOlder.value = true;
+ }
}
error.value = false;
@@ -130,15 +144,22 @@ export function usePagination(props: {
if (i === 10) item._shouldInsertAd_ = true;
}
- if (res.length === 0) {
- canFetchOlder.value = false;
- fetchingOlder.value = false;
- } else {
- pushItems(res);
- canFetchOlder.value = true;
- fetchingOlder.value = false;
+ pushItems(res);
+
+ if (props.ctx.canFetchDetection === 'limit') {
+ if (res.length < FIRST_FETCH_LIMIT) {
+ canFetchOlder.value = false;
+ } else {
+ canFetchOlder.value = true;
+ }
+ } else if (props.ctx.canFetchDetection === 'safe' || props.ctx.canFetchDetection == null) {
+ if (res.length === 0) {
+ canFetchOlder.value = false;
+ } else {
+ canFetchOlder.value = true;
+ }
}
- }, err => {
+ }).finally(() => {
fetchingOlder.value = false;
});
}
@@ -232,9 +253,11 @@ export function usePagination(props: {
}
}
- onMounted(() => {
- init();
- });
+ if (props.autoInit !== false) {
+ onMounted(() => {
+ init();
+ });
+ }
return {
items: items as DeepReadonly>,
diff --git a/packages/frontend/src/drag-and-drop.ts b/packages/frontend/src/drag-and-drop.ts
new file mode 100644
index 0000000000..3c6f22f24b
--- /dev/null
+++ b/packages/frontend/src/drag-and-drop.ts
@@ -0,0 +1,48 @@
+/*
+ * SPDX-FileCopyrightText: syuilo and misskey-project
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import * as Misskey from 'misskey-js';
+
+type DragDataMap = {
+ driveFiles: Misskey.entities.DriveFile[];
+ driveFolders: Misskey.entities.DriveFolder[];
+ deckColumn: string;
+};
+
+// NOTE: dataTransfer の format は大文字小文字区別されないっぽいので toLowerCase が必要
+
+export function setDragData(
+ event: DragEvent,
+ type: T,
+ data: DragDataMap[T],
+) {
+ if (event.dataTransfer == null) return;
+
+ event.dataTransfer.setData(`misskey/${type}`.toLowerCase(), JSON.stringify(data));
+}
+
+export function getDragData(
+ event: DragEvent,
+ type: T,
+): DragDataMap[T] | null {
+ if (event.dataTransfer == null) return null;
+
+ const data = event.dataTransfer.getData(`misskey/${type}`.toLowerCase());
+ if (data == null || data === '') return null;
+
+ return JSON.parse(data);
+}
+
+export function checkDragDataType(
+ event: DragEvent,
+ types: (keyof DragDataMap)[],
+): boolean {
+ if (event.dataTransfer == null) return false;
+
+ const dataType = event.dataTransfer.types[0];
+ if (dataType == null || dataType === '') return false;
+
+ return types.some((type) => `misskey/${type}`.toLowerCase() === dataType.toLowerCase());
+}
diff --git a/packages/frontend/src/events.ts b/packages/frontend/src/events.ts
index 26b1881d15..649561cd75 100644
--- a/packages/frontend/src/events.ts
+++ b/packages/frontend/src/events.ts
@@ -13,6 +13,11 @@ type Events = {
clientNotification: (notification: Misskey.entities.Notification) => void;
notePosted: (note: Misskey.entities.Note) => void;
noteDeleted: (noteId: Misskey.entities.Note['id']) => void;
+ driveFileCreated: (file: Misskey.entities.DriveFile) => void;
+ driveFilesUpdated: (files: Misskey.entities.DriveFile[]) => void;
+ driveFilesDeleted: (files: Misskey.entities.DriveFile[]) => void;
+ driveFoldersUpdated: (folders: Misskey.entities.DriveFolder[]) => void;
+ driveFoldersDeleted: (folders: Misskey.entities.DriveFolder[]) => void;
};
export const globalEvents = new EventEmitter();
diff --git a/packages/frontend/src/instance.ts b/packages/frontend/src/instance.ts
index 2943e60e43..a5397f0c0d 100644
--- a/packages/frontend/src/instance.ts
+++ b/packages/frontend/src/instance.ts
@@ -29,8 +29,6 @@ if (providedAt > cachedAt) {
export const instance: Misskey.entities.MetaDetailed = reactive(cachedMeta ?? {});
-export const isEnabledUrlPreview = computed(() => instance.enableUrlPreview ?? true);
-
export async function fetchInstance(force = false): Promise {
if (!force) {
const cachedAt = miLocalStorage.getItem('instanceCachedAt') ? parseInt(miLocalStorage.getItem('instanceCachedAt')!) : 0;
diff --git a/packages/frontend/src/os.ts b/packages/frontend/src/os.ts
index d891525782..a513ae4902 100644
--- a/packages/frontend/src/os.ts
+++ b/packages/frontend/src/os.ts
@@ -592,38 +592,6 @@ export async function selectUser(opts: { includeSelf?: boolean; localOnly?: bool
});
}
-export async function selectDriveFile(multiple: boolean): Promise {
- return new Promise(resolve => {
- const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkDriveSelectDialog.vue')), {
- type: 'file',
- multiple,
- }, {
- done: files => {
- if (files) {
- resolve(files);
- }
- },
- closed: () => dispose(),
- });
- });
-}
-
-export async function selectDriveFolder(multiple: boolean): Promise {
- return new Promise(resolve => {
- const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkDriveSelectDialog.vue')), {
- type: 'folder',
- multiple,
- }, {
- done: folders => {
- if (folders) {
- resolve(folders);
- }
- },
- closed: () => dispose(),
- });
- });
-}
-
export async function selectRole(params: ComponentProps): Promise<
{ canceled: true; result: undefined; } |
{ canceled: false; result: Misskey.entities.Role[] }
@@ -641,10 +609,10 @@ export async function selectRole(params: ComponentProps): Promise {
+export async function pickEmoji(anchorElement: HTMLElement, opts: ComponentProps): Promise {
return new Promise(resolve => {
const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkEmojiPickerDialog.vue')), {
- src,
+ anchorElement,
...opts,
}, {
done: emoji => {
@@ -655,15 +623,13 @@ export async function pickEmoji(src: HTMLElement, opts: ComponentProps {
+export async function cropImageFile(imageFile: File | Blob, options: {
+ aspectRatio: number | null;
+}): Promise {
return new Promise(resolve => {
const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkCropperDialog.vue')), {
- file: image,
+ imageFile: imageFile,
aspectRatio: options.aspectRatio,
- uploadFolder: options.uploadFolder,
}, {
ok: x => {
resolve(x);
@@ -673,20 +639,20 @@ export async function cropImage(image: Misskey.entities.DriveFile, options: {
});
}
-export function popupMenu(items: MenuItem[], src?: HTMLElement | EventTarget | null, options?: {
+export function popupMenu(items: MenuItem[], anchorElement?: HTMLElement | EventTarget | null, options?: {
align?: string;
width?: number;
onClosing?: () => void;
}): Promise {
- if (!(src instanceof HTMLElement)) {
- src = null;
+ if (!(anchorElement instanceof HTMLElement)) {
+ anchorElement = null;
}
- let returnFocusTo = getHTMLElementOrNull(src) ?? getHTMLElementOrNull(window.document.activeElement);
+ let returnFocusTo = getHTMLElementOrNull(anchorElement) ?? getHTMLElementOrNull(window.document.activeElement);
return new Promise(resolve => nextTick(() => {
const { dispose } = popup(MkPopupMenu, {
items,
- src,
+ anchorElement,
width: options?.width,
align: options?.align,
returnFocusTo,
@@ -775,3 +741,54 @@ export function checkExistence(fileData: ArrayBuffer): Promise {
});
});
}*/
+
+export function chooseFileFromPc(
+ options: {
+ multiple?: boolean;
+ } = {},
+): Promise {
+ return new Promise((res, rej) => {
+ const input = window.document.createElement('input');
+ input.type = 'file';
+ input.multiple = options.multiple ?? false;
+ input.onchange = () => {
+ if (!input.files) return res([]);
+
+ res(Array.from(input.files));
+
+ // 一応廃棄
+ (window as any).__misskey_input_ref__ = null;
+ };
+
+ // https://qiita.com/fukasawah/items/b9dc732d95d99551013d
+ // iOS Safari で正常に動かす為のおまじない
+ (window as any).__misskey_input_ref__ = input;
+
+ input.click();
+ });
+}
+
+export function launchUploader(
+ files: File[],
+ options?: {
+ folderId?: string | null;
+ multiple?: boolean;
+ },
+): Promise {
+ return new Promise((res, rej) => {
+ if (files.length === 0) return rej();
+ const { dispose } = popup(defineAsyncComponent(() => import('@/components/MkUploaderDialog.vue')), {
+ files: markRaw(files),
+ folderId: options?.folderId,
+ multiple: options?.multiple,
+ }, {
+ done: driveFiles => {
+ if (driveFiles.length === 0) return rej();
+ res(driveFiles);
+ },
+ closed: () => dispose(),
+ });
+ });
+}
+
+export const pageFolderTeleportCount = ref(0);
diff --git a/packages/frontend/src/pages/about-misskey.vue b/packages/frontend/src/pages/about-misskey.vue
index 7c63c8c1ef..7916cc7834 100644
--- a/packages/frontend/src/pages/about-misskey.vue
+++ b/packages/frontend/src/pages/about-misskey.vue
@@ -390,6 +390,7 @@ const patrons = [
'まゆつな空高',
'asata',
'ruru',
+ 'みりめい',
];
const thereIsTreasure = ref($i && !claimedAchievements.includes('foundTreasure'));
diff --git a/packages/frontend/src/pages/admin/abuses.vue b/packages/frontend/src/pages/admin/abuses.vue
index 14e8e600b0..4dbb573ceb 100644
--- a/packages/frontend/src/pages/admin/abuses.vue
+++ b/packages/frontend/src/pages/admin/abuses.vue
@@ -11,9 +11,9 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ i18n.ts.notificationSetting }}
-
+();
const react = inject(DI.mfmEmojiReactCallback);
const customEmojiName = computed(() => (props.name[0] === ':' ? props.name.substring(1, props.name.length - 1) : props.name).replace('@.', ''));
const isLocal = computed(() => !props.host && (customEmojiName.value.endsWith('@.') || !customEmojiName.value.includes('@')));
+const emojiCodeToMute = makeEmojiMuteKey(props);
+const isMuted = checkEmojiMuted(emojiCodeToMute);
+const shouldMute = computed(() => !props.ignoreMuted && isMuted.value);
const rawUrl = computed(() => {
if (props.url) {
@@ -95,14 +109,18 @@ function onClick(ev: MouseEvent) {
menuItems.push({
type: 'label',
text: `:${props.name}:`,
- }, {
- text: i18n.ts.copy,
- icon: 'ti ti-copy',
- action: () => {
- copyToClipboard(`:${props.name}:`);
- },
});
+ if (isLocal.value) {
+ menuItems.push({
+ text: i18n.ts.copy,
+ icon: 'ti ti-copy',
+ action: () => {
+ copyToClipboard(`:${props.name}:`);
+ },
+ });
+ }
+
if (props.menuReaction && react) {
menuItems.push({
text: i18n.ts.doReaction,
@@ -113,21 +131,43 @@ function onClick(ev: MouseEvent) {
});
}
- menuItems.push({
- text: i18n.ts.info,
- icon: 'ti ti-info-circle',
- action: async () => {
- const { dispose } = os.popup(MkCustomEmojiDetailedDialog, {
- emoji: await misskeyApiGet('emoji', {
- name: customEmojiName.value,
- }),
- }, {
- closed: () => dispose(),
- });
- },
- });
+ if (isLocal.value) {
+ menuItems.push({
+ type: 'divider',
+ }, {
+ text: i18n.ts.info,
+ icon: 'ti ti-info-circle',
+ action: async () => {
+ const { dispose } = os.popup(MkCustomEmojiDetailedDialog, {
+ emoji: await misskeyApiGet('emoji', {
+ name: customEmojiName.value,
+ }),
+ }, {
+ closed: () => dispose(),
+ });
+ },
+ });
+ }
- if ($i?.isModerator ?? $i?.isAdmin) {
+ if (isMuted.value) {
+ menuItems.push({
+ text: i18n.ts.emojiUnmute,
+ icon: 'ti ti-mood-smile',
+ action: async () => {
+ await unmute();
+ },
+ });
+ } else {
+ menuItems.push({
+ text: i18n.ts.emojiMute,
+ icon: 'ti ti-mood-off',
+ action: async () => {
+ await mute();
+ },
+ });
+ }
+
+ if (($i?.isModerator ?? $i?.isAdmin) && isLocal.value) {
menuItems.push({
text: i18n.ts.edit,
icon: 'ti ti-pencil',
@@ -152,6 +192,36 @@ async function edit(name: string) {
});
}
+function mute() {
+ const titleEmojiName = isLocal.value
+ ? `:${customEmojiName.value}:`
+ : emojiCodeToMute;
+ os.confirm({
+ type: 'question',
+ title: i18n.tsx.muteX({ x: titleEmojiName }),
+ }).then(({ canceled }) => {
+ if (canceled) {
+ return;
+ }
+ muteEmoji(emojiCodeToMute);
+ });
+}
+
+function unmute() {
+ const titleEmojiName = isLocal.value
+ ? `:${customEmojiName.value}:`
+ : emojiCodeToMute;
+ os.confirm({
+ type: 'question',
+ title: i18n.tsx.unmuteX({ x: titleEmojiName }),
+ }).then(({ canceled }) => {
+ if (canceled) {
+ return;
+ }
+ unmuteEmoji(emojiCodeToMute);
+ });
+}
+
diff --git a/packages/frontend/src/components/global/MkUrl.vue b/packages/frontend/src/components/global/MkUrl.vue
index 2478b59f00..1da16b8923 100644
--- a/packages/frontend/src/components/global/MkUrl.vue
+++ b/packages/frontend/src/components/global/MkUrl.vue
@@ -30,7 +30,7 @@ import { toUnicode as decodePunycode } from 'punycode.js';
import { url as local } from '@@/js/config.js';
import * as os from '@/os.js';
import { useTooltip } from '@/composables/use-tooltip.js';
-import { isEnabledUrlPreview } from '@/instance.js';
+import { isEnabledUrlPreview } from '@/utility/url-preview.js';
import type { MkABehavior } from '@/components/global/MkA.vue';
import { maybeMakeRelative } from '@@/js/url.js';
diff --git a/packages/frontend/src/components/index.ts b/packages/frontend/src/components/index.ts
index 9981772ae8..19766e8575 100644
--- a/packages/frontend/src/components/index.ts
+++ b/packages/frontend/src/components/index.ts
@@ -26,6 +26,7 @@ import MkStickyContainer from './global/MkStickyContainer.vue';
import MkLazy from './global/MkLazy.vue';
import MkResult from './global/MkResult.vue';
import MkSystemIcon from './global/MkSystemIcon.vue';
+import MkTip from './global/MkTip.vue';
import PageWithHeader from './global/PageWithHeader.vue';
import PageWithAnimBg from './global/PageWithAnimBg.vue';
import SearchMarker from './global/SearchMarker.vue';
@@ -65,6 +66,7 @@ export const components = {
MkLazy: MkLazy,
MkResult: MkResult,
MkSystemIcon: MkSystemIcon,
+ MkTip: MkTip,
PageWithHeader: PageWithHeader,
PageWithAnimBg: PageWithAnimBg,
SearchMarker: SearchMarker,
@@ -98,6 +100,7 @@ declare module '@vue/runtime-core' {
MkLazy: typeof MkLazy;
MkResult: typeof MkResult;
MkSystemIcon: typeof MkSystemIcon;
+ MkTip: typeof MkTip;
PageWithHeader: typeof PageWithHeader;
PageWithAnimBg: typeof PageWithAnimBg;
SearchMarker: typeof SearchMarker;
diff --git a/packages/frontend/src/components/page/page.text.vue b/packages/frontend/src/components/page/page.text.vue
index 7702e250e4..a00eb0b5ca 100644
--- a/packages/frontend/src/components/page/page.text.vue
+++ b/packages/frontend/src/components/page/page.text.vue
@@ -17,7 +17,7 @@ import { defineAsyncComponent } from 'vue';
import * as mfm from 'mfm-js';
import * as Misskey from 'misskey-js';
import { extractUrlFromMfm } from '@/utility/extract-url-from-mfm.js';
-import { isEnabledUrlPreview } from '@/instance.js';
+import { isEnabledUrlPreview } from '@/utility/url-preview.js';
const MkUrlPreview = defineAsyncComponent(() => import('@/components/MkUrlPreview.vue'));
diff --git a/packages/frontend/src/composables/use-note-capture.ts b/packages/frontend/src/composables/use-note-capture.ts
index 2f33c25a0a..dd00c2b66e 100644
--- a/packages/frontend/src/composables/use-note-capture.ts
+++ b/packages/frontend/src/composables/use-note-capture.ts
@@ -191,7 +191,9 @@ export function useNoteCapture(props: {
note: Pick
-
+
Progress
{{ Math.floor(job.progress * 100) }}%
@@ -150,7 +150,7 @@ SPDX-License-Identifier: AGPL-3.0-only
Update
- {{ i18n.ts._customEmojisManager._local._register.emojiInputAreaCaption }}
-
- -
-
- {{ i18n.ts._customEmojisManager._local._register.emojiInputAreaList1 }} -
- {{ i18n.ts._customEmojisManager._local._register.emojiInputAreaList2 }} -
- {{ i18n.ts._customEmojisManager._local._register.emojiInputAreaList3 }} -
@@ -94,8 +83,7 @@ import MkFolder from '@/components/MkFolder.vue';
import MkButton from '@/components/MkButton.vue';
import * as os from '@/os.js';
import { validators } from '@/components/grid/cell-validators.js';
-import { chooseFileFromDrive, chooseFileFromPc } from '@/utility/select-file.js';
-import { uploadFile } from '@/utility/upload.js';
+import { chooseDriveFile, chooseFileFromPcAndUpload } from '@/utility/drive.js';
import { extractDroppedItems, flattenDroppedFiles } from '@/utility/file-drop.js';
import XRegisterLogs from '@/pages/admin/custom-emojis-manager.logs.vue';
import { copyGridDataToClipboard } from '@/components/grid/grid-utils.js';
@@ -311,75 +299,21 @@ async function onClearClicked() {
}
}
-async function onDrop(ev: DragEvent) {
- isDragOver.value = false;
-
- const droppedFiles = await extractDroppedItems(ev).then(it => flattenDroppedFiles(it));
- const confirm = await os.confirm({
- type: 'info',
- text: i18n.tsx._customEmojisManager._local._register.confirmUploadEmojisDescription({ count: droppedFiles.length }),
- });
- if (confirm.canceled) {
- return;
- }
-
- const uploadedItems = Array.of<{ droppedFile: DroppedFile, driveFile: Misskey.entities.DriveFile }>();
- try {
- uploadedItems.push(
- ...await os.promiseDialog(
- Promise.all(
- droppedFiles.map(async (it) => ({
- droppedFile: it,
- driveFile: await uploadFile(
- it.file,
- selectedFolderId.value,
- it.file.name.replace(/\.[^.]+$/, ''),
- true,
- ),
- }),
- ),
- ),
- () => {
- },
- () => {
- },
- ),
- );
- } catch (err) {
- // ダイアログは共通部品側で出ているはずなので何もしない
- return;
- }
-
- const items = uploadedItems.map(({ droppedFile, driveFile }) => {
- const item = fromDriveFile(driveFile);
- if (directoryToCategory.value) {
- item.category = droppedFile.path
- .replace(/^\//, '')
- .replace(/\/[^/]+$/, '')
- .replace(droppedFile.file.name, '');
- }
- return item;
- });
-
- gridItems.value.push(...items);
-}
-
async function onFileSelectClicked() {
- const driveFiles = await chooseFileFromPc(
- true,
- {
- uploadFolder: selectedFolderId.value,
- keepOriginal: true,
- // 拡張子は消す
- nameConverter: (file) => file.name.replace(/\.[a-zA-Z0-9]+$/, ''),
- },
- );
+ const driveFiles = await chooseFileFromPcAndUpload({
+ multiple: true,
+ folderId: selectedFolderId.value,
+ // 拡張子は消す
+ nameConverter: (file) => file.name.replace(/\.[a-zA-Z0-9]+$/, ''),
+ });
gridItems.value.push(...driveFiles.map(fromDriveFile));
}
async function onDriveSelectClicked() {
- const driveFiles = await chooseFileFromDrive(true);
+ const driveFiles = await chooseDriveFile({
+ multiple: true,
+ });
gridItems.value.push(...driveFiles.map(fromDriveFile));
}
@@ -436,23 +370,6 @@ onMounted(async () => {
background-color: var(--MI_THEME-infoWarnBg);
}
-.uploadBox {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- width: 100%;
- height: auto;
- border: 0.5px dotted var(--MI_THEME-accentedBg);
- border-radius: var(--MI-radius);
- background-color: var(--MI_THEME-accentedBg);
- box-sizing: border-box;
-
- &.dragOver {
- cursor: copy;
- }
-}
-
.gridArea {
padding-top: 8px;
padding-bottom: 8px;
diff --git a/packages/frontend/src/pages/admin/job-queue.chart.vue b/packages/frontend/src/pages/admin/job-queue.chart.vue
index f7b7eef87f..a1920e277b 100644
--- a/packages/frontend/src/pages/admin/job-queue.chart.vue
+++ b/packages/frontend/src/pages/admin/job-queue.chart.vue
@@ -48,6 +48,8 @@ watch(() => props.dataSet, () => {
});
onMounted(() => {
+ if (chartEl.value == null) return;
+
const vLineColor = store.s.darkMode ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
chartInstance = new Chart(chartEl.value, {
diff --git a/packages/frontend/src/pages/admin/job-queue.job.vue b/packages/frontend/src/pages/admin/job-queue.job.vue
index 1e13c6a278..bc5ea80e55 100644
--- a/packages/frontend/src/pages/admin/job-queue.job.vue
+++ b/packages/frontend/src/pages/admin/job-queue.job.vue
@@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only
Copy raw
Refresh view
Promote
- Move to
+
Remove
@@ -96,7 +96,7 @@ SPDX-License-Identifier: AGPL-3.0-only
Attempts
{{ job.attempts }} of {{ job.opts.attempts }}
-
-
+
+
- {{ i18n.ts.markAsReadAllNotifications }}
+ {{ i18n.ts.notificationSoundSettings }}
+
Enable stacking router view
+
+ Enable folder page view
+
+ {{ i18n.ts.markAsReadAllNotifications }}
{{ i18n.ts._notification.sendTestNotification }}
{{ i18n.ts._notification.flushNotification }}
diff --git a/packages/frontend/src/pages/settings/other.vue b/packages/frontend/src/pages/settings/other.vue
index 83a6aa167c..f09cc9c9bc 100644
--- a/packages/frontend/src/pages/settings/other.vue
+++ b/packages/frontend/src/pages/settings/other.vue
@@ -96,6 +96,9 @@ SPDX-License-Identifier: AGPL-3.0-only
+
+
+
+
+
+ {{ i18n.ts._settings.uiAnimations }}
+ {{ i18n.ts.turnOffToImprovePerformance }}
+
+
+
+
@@ -575,6 +584,15 @@ SPDX-License-Identifier: AGPL-3.0-only
+
+
+
+ {{ i18n.ts._settings.enableHighQualityImagePlaceholders }}
+ {{ i18n.ts.turnOffToImprovePerformance }}
+
+
+
+
@@ -583,6 +601,24 @@ SPDX-License-Identifier: AGPL-3.0-only
+
+
+
@@ -608,9 +644,13 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ i18n.ts._dataSaver._avatar.title }}
{{ i18n.ts._dataSaver._avatar.description }}
-
+
+ {{ i18n.ts._clientPerformanceIssueTip.title }}
+
+
+ {{ i18n.ts._clientPerformanceIssueTip.makeSureDisabledAdBlocker }}
+ {{ i18n.ts._clientPerformanceIssueTip.makeSureDisabledAdBlocker_description }}
+
+
+ {{ i18n.ts._clientPerformanceIssueTip.makeSureDisabledCustomCss }}
+ {{ i18n.ts._clientPerformanceIssueTip.makeSureDisabledCustomCss_description }}
+
+
+ {{ i18n.ts._clientPerformanceIssueTip.makeSureDisabledAddons }}
+ {{ i18n.ts._clientPerformanceIssueTip.makeSureDisabledAddons_description }}
+
-
+
{{ i18n.ts._timelineDescription[src] }}
-
+
{{ i18n.ts.userPagePinTip }}
-
-
-
@@ -21,6 +24,7 @@ SPDX-License-Identifier: AGPL-3.0-only
import { onMounted, ref } from 'vue';
import * as Misskey from 'misskey-js';
import { misskeyApi } from '@/utility/misskey-api.js';
+import MkButton from '@/components/MkButton.vue';
import MkContainer from '@/components/MkContainer.vue';
import { i18n } from '@/i18n.js';
import MkNoteMediaGrid from '@/components/MkNoteMediaGrid.vue';
@@ -30,17 +34,12 @@ const props = defineProps<{
}>();
const emit = defineEmits<{
- (ev: 'unfold'): void;
+ (ev: 'showMore'): void;
}>();
const fetching = ref(true);
const notes = ref
+ {{ i18n.ts.showMore }}
+
+ {{ i18n.ts.nothing }}
-
-
+
![]()
{{ instance.host }}
-
+