Merge remote-tracking branch 'misskey/develop' into develop

This commit is contained in:
ThatOneCalculator 2022-07-20 22:04:12 -07:00
commit 490fab8335
107 changed files with 1270 additions and 1081 deletions

View file

@ -12,6 +12,7 @@ You should also include the user name that made the change.
## 12.x.x (unreleased) ## 12.x.x (unreleased)
### Improvements ### Improvements
- Client: Add vi-VN language support
### Bugfixes ### Bugfixes
- Client: 一度作ったwebhookの設定画面を開こうとするとページがフリーズする @syuilo - Client: 一度作ったwebhookの設定画面を開こうとするとページがフリーズする @syuilo

View file

@ -36,6 +36,7 @@ const languages = [
'sk-SK', 'sk-SK',
'ug-CN', 'ug-CN',
'uk-UA', 'uk-UA',
'vi-VN',
'zh-CN', 'zh-CN',
'zh-TW', 'zh-TW',
]; ];

View file

@ -1,6 +1,6 @@
{ {
"name": "misskey", "name": "misskey",
"version": "12.117.1.2-calc", "version": "12.118.0.b2-calc",
"codename": "indigo", "codename": "indigo",
"repository": { "repository": {
"type": "git", "type": "git",

View file

@ -6,7 +6,7 @@
<XNoteHeader class="header" :note="note" :mini="true"/> <XNoteHeader class="header" :note="note" :mini="true"/>
<div class="body"> <div class="body">
<p v-if="note.cw != null" class="cw"> <p v-if="note.cw != null" class="cw">
<Mfm v-if="note.cw != ''" class="text" :text="note.cw" :author="note.user" :i="$i" :custom-emojis="note.emojis" /> <Mfm v-if="note.cw != ''" class="text" :text="note.cw" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
<XCwButton v-model="showContent" :note="note"/> <XCwButton v-model="showContent" :note="note"/>
</p> </p>
<div v-show="note.cw == null || showContent" class="content"> <div v-show="note.cw == null || showContent" class="content">
@ -19,7 +19,7 @@
<MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :detail="true" :depth="depth + 1"/> <MkNoteSub v-for="reply in replies" :key="reply.id" :note="reply" class="reply" :detail="true" :depth="depth + 1"/>
</template> </template>
<div v-else class="more"> <div v-else class="more">
<MkA class="text _link" :to="notePage(note)">{{ $ts.continueThread }} <i class="fas fa-angle-double-right"></i></MkA> <MkA class="text _link" :to="notePage(note)">{{ i18n.ts.continueThread }} <i class="fas fa-angle-double-right"></i></MkA>
</div> </div>
</div> </div>
</template> </template>
@ -27,11 +27,12 @@
<script lang="ts" setup> <script lang="ts" setup>
import { } from 'vue'; import { } from 'vue';
import * as misskey from 'misskey-js'; import * as misskey from 'misskey-js';
import { notePage } from '@/filters/note';
import XNoteHeader from './note-header.vue'; import XNoteHeader from './note-header.vue';
import MkNoteSubNoteContent from './sub-note-content.vue'; import MkNoteSubNoteContent from './sub-note-content.vue';
import XCwButton from './cw-button.vue'; import XCwButton from './cw-button.vue';
import { notePage } from '@/filters/note';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
note: misskey.entities.Note; note: misskey.entities.Note;
@ -49,7 +50,7 @@ let replies: misskey.entities.Note[] = $ref([]);
if (props.detail) { if (props.detail) {
os.api('notes/children', { os.api('notes/children', {
noteId: props.note.id, noteId: props.note.id,
limit: 5 limit: 5,
}).then(res => { }).then(res => {
replies = res; replies = res;
}); });

View file

@ -9,7 +9,7 @@
</div> </div>
</MkA> </MkA>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.registeredDate }}</template> <template #key>{{ i18n.ts.registeredDate }}</template>
<template #value>{{ new Date(report.targetUser.createdAt).toLocaleString() }} (<MkTime :time="report.targetUser.createdAt"/>)</template> <template #value>{{ new Date(report.targetUser.createdAt).toLocaleString() }} (<MkTime :time="report.targetUser.createdAt"/>)</template>
</MkKeyValue> </MkKeyValue>
</div> </div>
@ -18,18 +18,18 @@
<Mfm :text="report.comment"/> <Mfm :text="report.comment"/>
</div> </div>
<hr/> <hr/>
<div>{{ $ts.reporter }}: <MkAcct :user="report.reporter"/></div> <div>{{ i18n.ts.reporter }}: <MkAcct :user="report.reporter"/></div>
<div v-if="report.assignee"> <div v-if="report.assignee">
{{ $ts.moderator }}: {{ i18n.ts.moderator }}:
<MkAcct :user="report.assignee"/> <MkAcct :user="report.assignee"/>
</div> </div>
<div><MkTime :time="report.createdAt"/></div> <div><MkTime :time="report.createdAt"/></div>
<div class="action"> <div class="action">
<MkSwitch v-model="forward" :disabled="report.targetUser.host == null || report.resolved"> <MkSwitch v-model="forward" :disabled="report.targetUser.host == null || report.resolved">
{{ $ts.forwardReport }} {{ i18n.ts.forwardReport }}
<template #caption>{{ $ts.forwardReportIsAnonymous }}</template> <template #caption>{{ i18n.ts.forwardReportIsAnonymous }}</template>
</MkSwitch> </MkSwitch>
<MkButton v-if="!report.resolved" primary @click="resolve">{{ $ts.abuseMarkAsResolved }}</MkButton> <MkButton v-if="!report.resolved" primary @click="resolve">{{ i18n.ts.abuseMarkAsResolved }}</MkButton>
</div> </div>
</div> </div>
</div> </div>
@ -41,6 +41,7 @@ import MkSwitch from '@/components/form/switch.vue';
import MkKeyValue from '@/components/key-value.vue'; import MkKeyValue from '@/components/key-value.vue';
import { acct, userPage } from '@/filters/user'; import { acct, userPage } from '@/filters/user';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
report: any; report: any;

View file

@ -9,7 +9,7 @@
@ok="ok()" @ok="ok()"
@closed="$emit('closed')" @closed="$emit('closed')"
> >
<template #header>{{ $ts.cropImage }}</template> <template #header>{{ i18n.ts.cropImage }}</template>
<template #default="{ width, height }"> <template #default="{ width, height }">
<div class="mk-cropper-dialog" :style="`--vw: ${width}px; --vh: ${height}px;`"> <div class="mk-cropper-dialog" :style="`--vw: ${width}px; --vh: ${height}px;`">
<Transition name="fade"> <Transition name="fade">
@ -36,6 +36,7 @@ import { $i } from '@/account';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { apiUrl, url } from '@/config'; import { apiUrl, url } from '@/config';
import { query } from '@/scripts/url'; import { query } from '@/scripts/url';
import { i18n } from '@/i18n';
const emit = defineEmits<{ const emit = defineEmits<{
(ev: 'ok', cropped: misskey.entities.DriveFile): void; (ev: 'ok', cropped: misskey.entities.DriveFile): void;

View file

@ -9,7 +9,7 @@
:disabled="disabled" :disabled="disabled"
@keydown.enter="toggle" @keydown.enter="toggle"
> >
<span ref="button" v-adaptive-border v-tooltip="checked ? $ts.itsOn : $ts.itsOff" class="button" @click.prevent="toggle"> <span ref="button" v-adaptive-border v-tooltip="checked ? i18n.ts.itsOn : i18n.ts.itsOff" class="button" @click.prevent="toggle">
<i class="check fas fa-check"></i> <i class="check fas fa-check"></i>
</span> </span>
<span class="label"> <span class="label">
@ -24,6 +24,7 @@
import { toRefs, Ref } from 'vue'; import { toRefs, Ref } from 'vue';
import * as os from '@/os'; import * as os from '@/os';
import Ripple from '@/components/ripple.vue'; import Ripple from '@/components/ripple.vue';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
modelValue: boolean | Ref<boolean>; modelValue: boolean | Ref<boolean>;

View file

@ -29,7 +29,7 @@
</div> </div>
<div class="caption"><slot name="caption"></slot></div> <div class="caption"><slot name="caption"></slot></div>
<MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-check"></i> {{ $ts.save }}</MkButton> <MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-check"></i> {{ i18n.ts.save }}</MkButton>
</div> </div>
</template> </template>
@ -38,6 +38,7 @@ import { onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from '
import { debounce } from 'throttle-debounce'; import { debounce } from 'throttle-debounce';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import { useInterval } from '@/scripts/use-interval'; import { useInterval } from '@/scripts/use-interval';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
modelValue: string | number; modelValue: string | number;

View file

@ -18,34 +18,25 @@
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { defineComponent } from 'vue'; import { } from 'vue';
export default defineComponent({ const props = defineProps<{
props: { modelValue: any;
modelValue: { value: any;
required: false, disabled: boolean;
}, }>();
value: {
required: false, const emit = defineEmits<{
}, (ev: 'update:modelValue', value: any): void;
disabled: { }>();
type: Boolean,
default: false, let checked = $computed(() => props.modelValue === props.value);
},
}, function toggle(): void {
computed: { if (props.disabled) return;
checked(): boolean { emit('update:modelValue', props.value);
return this.modelValue === this.value; }
},
},
methods: {
toggle() {
if (this.disabled) return;
this.$emit('update:modelValue', this.value);
},
},
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -54,13 +45,13 @@ export default defineComponent({
display: inline-block; display: inline-block;
text-align: left; text-align: left;
cursor: pointer; cursor: pointer;
padding: 9px 12px; padding: 8px 10px;
min-width: 60px; min-width: 60px;
background-color: var(--panel); background-color: var(--panel);
background-clip: padding-box !important; background-clip: padding-box !important;
border: solid 1px var(--panel); border: solid 1px var(--panel);
border-radius: 6px; border-radius: 6px;
transition: all 0.3s; transition: all 0.2s;
> * { > * {
user-select: none; user-select: none;

View file

@ -22,7 +22,7 @@
</div> </div>
<div class="caption"><slot name="caption"></slot></div> <div class="caption"><slot name="caption"></slot></div>
<MkButton v-if="manualSave && changed" primary @click="updated"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton> <MkButton v-if="manualSave && changed" primary @click="updated"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
</div> </div>
</template> </template>
@ -31,6 +31,7 @@ import { onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs, VNode,
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import * as os from '@/os'; import * as os from '@/os';
import { useInterval } from '@/scripts/use-interval'; import { useInterval } from '@/scripts/use-interval';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
modelValue: string; modelValue: string;
@ -144,6 +145,8 @@ const onClick = (ev: MouseEvent) => {
} else if (Array.isArray(vnode.children)) { // } else if (Array.isArray(vnode.children)) { //
const fragment = vnode; const fragment = vnode;
scanOptions(fragment.children); scanOptions(fragment.children);
} else if (vnode.props == null) { // v-if false
// nop?
} else { } else {
const option = vnode; const option = vnode;
pushOption(option); pushOption(option);

View file

@ -9,7 +9,7 @@
:disabled="disabled" :disabled="disabled"
@keydown.enter="toggle" @keydown.enter="toggle"
> >
<span ref="button" v-tooltip="checked ? $ts.itsOn : $ts.itsOff" class="button" @click.prevent="toggle"> <span ref="button" v-tooltip="checked ? i18n.ts.itsOn : i18n.ts.itsOff" class="button" @click.prevent="toggle">
<div class="knob"></div> <div class="knob"></div>
</span> </span>
<span class="label"> <span class="label">
@ -23,6 +23,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { toRefs, Ref } from 'vue'; import { toRefs, Ref } from 'vue';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
modelValue: boolean | Ref<boolean>; modelValue: boolean | Ref<boolean>;

View file

@ -2,7 +2,8 @@
<div class="adhpbeos"> <div class="adhpbeos">
<div class="label" @click="focus"><slot name="label"></slot></div> <div class="label" @click="focus"><slot name="label"></slot></div>
<div class="input" :class="{ disabled, focused, tall, pre }"> <div class="input" :class="{ disabled, focused, tall, pre }">
<textarea ref="inputEl" <textarea
ref="inputEl"
v-model="v" v-model="v"
v-adaptive-border v-adaptive-border
:class="{ code, _monospace: code }" :class="{ code, _monospace: code }"
@ -21,14 +22,15 @@
</div> </div>
<div class="caption"><slot name="caption"></slot></div> <div class="caption"><slot name="caption"></slot></div>
<MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton> <MkButton v-if="manualSave && changed" primary class="save" @click="updated"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue'; import { defineComponent, onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
import MkButton from '@/components/ui/button.vue';
import { debounce } from 'throttle-debounce'; import { debounce } from 'throttle-debounce';
import MkButton from '@/components/ui/button.vue';
import { i18n } from '@/i18n';
export default defineComponent({ export default defineComponent({
components: { components: {
@ -37,66 +39,66 @@ export default defineComponent({
props: { props: {
modelValue: { modelValue: {
required: true required: true,
}, },
type: { type: {
type: String, type: String,
required: false required: false,
}, },
required: { required: {
type: Boolean, type: Boolean,
required: false required: false,
}, },
readonly: { readonly: {
type: Boolean, type: Boolean,
required: false required: false,
}, },
disabled: { disabled: {
type: Boolean, type: Boolean,
required: false required: false,
}, },
pattern: { pattern: {
type: String, type: String,
required: false required: false,
}, },
placeholder: { placeholder: {
type: String, type: String,
required: false required: false,
}, },
autofocus: { autofocus: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
autocomplete: { autocomplete: {
required: false required: false,
}, },
spellcheck: { spellcheck: {
required: false required: false,
}, },
code: { code: {
type: Boolean, type: Boolean,
required: false required: false,
}, },
tall: { tall: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
pre: { pre: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
debounce: { debounce: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
manualSave: { manualSave: {
type: Boolean, type: Boolean,
required: false, required: false,
default: false default: false,
}, },
}, },
@ -166,6 +168,7 @@ export default defineComponent({
onInput, onInput,
onKeydown, onKeydown,
updated, updated,
i18n,
}; };
}, },
}); });

View file

@ -2,14 +2,15 @@
<transition :name="$store.state.animation ? 'zoom' : ''" appear> <transition :name="$store.state.animation ? 'zoom' : ''" appear>
<div class="mjndxjcg"> <div class="mjndxjcg">
<img src="/static-assets/badges/error.jpg" class="_ghost" alt="Error"/> <img src="/static-assets/badges/error.jpg" class="_ghost" alt="Error"/>
<p><i class="fas fa-exclamation-triangle"></i> {{ $ts.somethingHappened }}</p> <p><i class="fas fa-exclamation-triangle"></i> {{ i18n.ts.somethingHappened }}</p>
<MkButton class="button" @click="() => $emit('retry')">{{ $ts.retry }}</MkButton> <MkButton class="button" @click="() => $emit('retry')">{{ i18n.ts.retry }}</MkButton>
</div> </div>
</transition> </transition>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import { i18n } from '@/i18n';
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View file

@ -11,8 +11,8 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { inject, nextTick, onMounted, onUnmounted, watch } from 'vue'; import { inject, nextTick, onBeforeUnmount, onMounted, onUnmounted, provide, watch } from 'vue';
import { Router } from '@/nirax'; import { Resolved, Router } from '@/nirax';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
const props = defineProps<{ const props = defineProps<{
@ -25,19 +25,37 @@ if (router == null) {
throw new Error('no router provided'); throw new Error('no router provided');
} }
let currentPageComponent = $shallowRef(router.getCurrentComponent()); const currentDepth = inject('routerCurrentDepth', 0);
let currentPageProps = $ref(router.getCurrentProps()); provide('routerCurrentDepth', currentDepth + 1);
let key = $ref(router.getCurrentKey());
function onChange({ route, props: newProps, key: newKey }) { function resolveNested(current: Resolved, d = 0): Resolved | null {
currentPageComponent = route.component; if (d === currentDepth) {
currentPageProps = newProps; return current;
key = newKey; } else {
if (current.child) {
return resolveNested(current.child, d + 1);
} else {
return null;
}
}
}
const current = resolveNested(router.current)!;
let currentPageComponent = $shallowRef(current.route.component);
let currentPageProps = $ref(current.props);
let key = $ref(current.route.path + JSON.stringify(Object.fromEntries(current.props)));
function onChange({ resolved, key: newKey }) {
const current = resolveNested(resolved);
if (current == null) return;
currentPageComponent = current.route.component;
currentPageProps = current.props;
key = current.route.path + JSON.stringify(Object.fromEntries(current.props));
} }
router.addListener('change', onChange); router.addListener('change', onChange);
onUnmounted(() => { onBeforeUnmount(() => {
router.removeListener('change', onChange); router.removeListener('change', onChange);
}); });
</script> </script>

View file

@ -4,29 +4,29 @@
<div class="body"> <div class="body">
<div class="selects" style="display: flex;"> <div class="selects" style="display: flex;">
<MkSelect v-model="chartSrc" style="margin: 0; flex: 1;"> <MkSelect v-model="chartSrc" style="margin: 0; flex: 1;">
<optgroup :label="$ts.federation"> <optgroup :label="i18n.ts.federation">
<option value="federation">{{ $ts._charts.federation }}</option> <option value="federation">{{ i18n.ts._charts.federation }}</option>
<option value="ap-request">{{ $ts._charts.apRequest }}</option> <option value="ap-request">{{ i18n.ts._charts.apRequest }}</option>
</optgroup> </optgroup>
<optgroup :label="$ts.users"> <optgroup :label="i18n.ts.users">
<option value="users">{{ $ts._charts.usersIncDec }}</option> <option value="users">{{ i18n.ts._charts.usersIncDec }}</option>
<option value="users-total">{{ $ts._charts.usersTotal }}</option> <option value="users-total">{{ i18n.ts._charts.usersTotal }}</option>
<option value="active-users">{{ $ts._charts.activeUsers }}</option> <option value="active-users">{{ i18n.ts._charts.activeUsers }}</option>
</optgroup> </optgroup>
<optgroup :label="$ts.notes"> <optgroup :label="i18n.ts.notes">
<option value="notes">{{ $ts._charts.notesIncDec }}</option> <option value="notes">{{ i18n.ts._charts.notesIncDec }}</option>
<option value="local-notes">{{ $ts._charts.localNotesIncDec }}</option> <option value="local-notes">{{ i18n.ts._charts.localNotesIncDec }}</option>
<option value="remote-notes">{{ $ts._charts.remoteNotesIncDec }}</option> <option value="remote-notes">{{ i18n.ts._charts.remoteNotesIncDec }}</option>
<option value="notes-total">{{ $ts._charts.notesTotal }}</option> <option value="notes-total">{{ i18n.ts._charts.notesTotal }}</option>
</optgroup> </optgroup>
<optgroup :label="$ts.drive"> <optgroup :label="i18n.ts.drive">
<option value="drive-files">{{ $ts._charts.filesIncDec }}</option> <option value="drive-files">{{ i18n.ts._charts.filesIncDec }}</option>
<option value="drive">{{ $ts._charts.storageUsageIncDec }}</option> <option value="drive">{{ i18n.ts._charts.storageUsageIncDec }}</option>
</optgroup> </optgroup>
</MkSelect> </MkSelect>
<MkSelect v-model="chartSpan" style="margin: 0 0 0 10px;"> <MkSelect v-model="chartSpan" style="margin: 0 0 0 10px;">
<option value="hour">{{ $ts.perHour }}</option> <option value="hour">{{ i18n.ts.perHour }}</option>
<option value="day">{{ $ts.perDay }}</option> <option value="day">{{ i18n.ts.perDay }}</option>
</MkSelect> </MkSelect>
</div> </div>
<div class="chart"> <div class="chart">
@ -71,6 +71,7 @@ import MkSelect from '@/components/form/select.vue';
import MkChart from '@/components/chart.vue'; import MkChart from '@/components/chart.vue';
import { useChartTooltip } from '@/scripts/use-chart-tooltip'; import { useChartTooltip } from '@/scripts/use-chart-tooltip';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
Chart.register( Chart.register(
ArcElement, ArcElement,

View file

@ -5,7 +5,7 @@
</div> </div>
<div class="value"> <div class="value">
<slot name="value"></slot> <slot name="value"></slot>
<button v-if="copy" v-tooltip="$ts.copy" class="_textButton" style="margin-left: 0.5em;" @click="copy_"><i class="far fa-copy"></i></button> <button v-if="copy" v-tooltip="i18n.ts.copy" class="_textButton" style="margin-left: 0.5em;" @click="copy_"><i class="far fa-copy"></i></button>
</div> </div>
</div> </div>
</template> </template>
@ -14,6 +14,7 @@
import { } from 'vue'; import { } from 'vue';
import copyToClipboard from '@/scripts/copy-to-clipboard'; import copyToClipboard from '@/scripts/copy-to-clipboard';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
copy?: string | null; copy?: string | null;

View file

@ -14,7 +14,7 @@
<div v-if="isRenote" class="renote"> <div v-if="isRenote" class="renote">
<MkAvatar class="avatar" :user="note.user"/> <MkAvatar class="avatar" :user="note.user"/>
<i class="fas fa-retweet"></i> <i class="fas fa-retweet"></i>
<I18n :src="$ts.renotedBy" tag="span"> <I18n :src="i18n.ts.renotedBy" tag="span">
<template #user> <template #user>
<MkA v-user-preview="note.userId" class="name" :to="userPage(note.user)"> <MkA v-user-preview="note.userId" class="name" :to="userPage(note.user)">
<MkUserName :user="note.user"/> <MkUserName :user="note.user"/>
@ -54,7 +54,7 @@
</p> </p>
<div v-show="appearNote.cw == null || showContent" class="content"> <div v-show="appearNote.cw == null || showContent" class="content">
<div class="text"> <div class="text">
<span v-if="appearNote.isHidden" style="opacity: 0.5">({{ $ts.private }})</span> <span v-if="appearNote.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
<MkA v-if="appearNote.replyId" class="reply" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA> <MkA v-if="appearNote.replyId" class="reply" :to="`/notes/${appearNote.replyId}`"><i class="fas fa-reply"></i></MkA>
<Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/> <Mfm v-if="appearNote.text" :text="appearNote.text" :author="appearNote.user" :i="$i" :custom-emojis="appearNote.emojis"/>
<a v-if="appearNote.renote != null" class="rp">RN:</a> <a v-if="appearNote.renote != null" class="rp">RN:</a>
@ -103,7 +103,7 @@
<MkNoteSub v-for="note in replies" :key="note.id" :note="note" class="reply" :detail="true"/> <MkNoteSub v-for="note in replies" :key="note.id" :note="note" class="reply" :detail="true"/>
</div> </div>
<div v-else class="_panel muted" @click="muted = false"> <div v-else class="_panel muted" @click="muted = false">
<I18n :src="$ts.userSaysSomething" tag="small"> <I18n :src="i18n.ts.userSaysSomething" tag="small">
<template #name> <template #name>
<MkA v-user-preview="appearNote.userId" class="name" :to="userPage(appearNote.user)"> <MkA v-user-preview="appearNote.userId" class="name" :to="userPage(appearNote.user)">
<MkUserName :user="appearNote.user"/> <MkUserName :user="appearNote.user"/>

View file

@ -3,7 +3,7 @@
<template #empty> <template #empty>
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/> <img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/>
<div>{{ $ts.noNotes }}</div> <div>{{ i18n.ts.noNotes }}</div>
</div> </div>
</template> </template>
@ -21,8 +21,8 @@
import { ref } from 'vue'; import { ref } from 'vue';
import XNote from '@/components/note.vue'; import XNote from '@/components/note.vue';
import XList from '@/components/date-separated-list.vue'; import XList from '@/components/date-separated-list.vue';
import MkPagination from '@/components/ui/pagination.vue'; import MkPagination, { Paging } from '@/components/ui/pagination.vue';
import { Paging } from '@/components/ui/pagination.vue'; import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
pagination: Paging; pagination: Paging;

View file

@ -61,10 +61,10 @@
<Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/> <Mfm :text="getNoteSummary(notification.note)" :plain="true" :nowrap="!full" :custom-emojis="notification.note.emojis"/>
<i class="fas fa-quote-right"></i> <i class="fas fa-quote-right"></i>
</MkA> </MkA>
<span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ $ts.youGotNewFollower }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span> <span v-if="notification.type === 'follow'" class="text" style="opacity: 0.6;">{{ i18n.ts.youGotNewFollower }}<div v-if="full"><MkFollowButton :user="notification.user" :full="true"/></div></span>
<span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ $ts.followRequestAccepted }}</span> <span v-if="notification.type === 'followRequestAccepted'" class="text" style="opacity: 0.6;">{{ i18n.ts.followRequestAccepted }}</span>
<span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ $ts.receiveFollowRequest }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ $ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ $ts.reject }}</button></div></span> <span v-if="notification.type === 'receiveFollowRequest'" class="text" style="opacity: 0.6;">{{ i18n.ts.receiveFollowRequest }}<div v-if="full && !followRequestDone"><button class="_textButton" @click="acceptFollowRequest()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectFollowRequest()">{{ i18n.ts.reject }}</button></div></span>
<span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ $ts.groupInvited }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ $ts.accept }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ $ts.reject }}</button></div></span> <span v-if="notification.type === 'groupInvited'" class="text" style="opacity: 0.6;">{{ i18n.ts.groupInvited }}: <b>{{ notification.invitation.group.name }}</b><div v-if="full && !groupInviteDone"><button class="_textButton" @click="acceptGroupInvitation()">{{ i18n.ts.accept }}</button> | <button class="_textButton" @click="rejectGroupInvitation()">{{ i18n.ts.reject }}</button></div></span>
<span v-if="notification.type === 'app'" class="text"> <span v-if="notification.type === 'app'" class="text">
<Mfm :text="notification.body" :nowrap="!full"/> <Mfm :text="notification.body" :nowrap="!full"/>
</span> </span>

View file

@ -3,7 +3,7 @@
<template #empty> <template #empty>
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/> <img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/>
<div>{{ $ts.noNotifications }}</div> <div>{{ i18n.ts.noNotifications }}</div>
</div> </div>
</template> </template>
@ -26,6 +26,7 @@ import XNote from '@/components/note.vue';
import * as os from '@/os'; import * as os from '@/os';
import { stream } from '@/stream'; import { stream } from '@/stream';
import { $i } from '@/account'; import { $i } from '@/account';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
includeTypes?: typeof notificationTypes[number][]; includeTypes?: typeof notificationTypes[number][];

View file

@ -114,7 +114,7 @@ function menu(ev) {
function back() { function back() {
history.pop(); history.pop();
router.change(history[history.length - 1].path, history[history.length - 1].key); router.replace(history[history.length - 1].path, history[history.length - 1].key);
} }
function close() { function close() {

View file

@ -1,7 +1,7 @@
<template> <template>
<div class="zmdxowus"> <div class="zmdxowus">
<p v-if="choices.length < 2" class="caution"> <p v-if="choices.length < 2" class="caution">
<i class="fas fa-exclamation-triangle"></i>{{ $ts._poll.noOnlyOneChoice }} <i class="fas fa-exclamation-triangle"></i>{{ i18n.ts._poll.noOnlyOneChoice }}
</p> </p>
<ul> <ul>
<li v-for="(choice, i) in choices" :key="i"> <li v-for="(choice, i) in choices" :key="i">
@ -12,34 +12,34 @@
</button> </button>
</li> </li>
</ul> </ul>
<MkButton v-if="choices.length < 10" class="add" @click="add">{{ $ts.add }}</MkButton> <MkButton v-if="choices.length < 10" class="add" @click="add">{{ i18n.ts.add }}</MkButton>
<MkButton v-else class="add" disabled>{{ $ts._poll.noMore }}</MkButton> <MkButton v-else class="add" disabled>{{ i18n.ts._poll.noMore }}</MkButton>
<MkSwitch v-model="multiple">{{ $ts._poll.canMultipleVote }}</MkSwitch> <MkSwitch v-model="multiple">{{ i18n.ts._poll.canMultipleVote }}</MkSwitch>
<section> <section>
<div> <div>
<MkSelect v-model="expiration" small> <MkSelect v-model="expiration" small>
<template #label>{{ $ts._poll.expiration }}</template> <template #label>{{ i18n.ts._poll.expiration }}</template>
<option value="infinite">{{ $ts._poll.infinite }}</option> <option value="infinite">{{ i18n.ts._poll.infinite }}</option>
<option value="at">{{ $ts._poll.at }}</option> <option value="at">{{ i18n.ts._poll.at }}</option>
<option value="after">{{ $ts._poll.after }}</option> <option value="after">{{ i18n.ts._poll.after }}</option>
</MkSelect> </MkSelect>
<section v-if="expiration === 'at'"> <section v-if="expiration === 'at'">
<MkInput v-model="atDate" small type="date" class="input"> <MkInput v-model="atDate" small type="date" class="input">
<template #label>{{ $ts._poll.deadlineDate }}</template> <template #label>{{ i18n.ts._poll.deadlineDate }}</template>
</MkInput> </MkInput>
<MkInput v-model="atTime" small type="time" class="input"> <MkInput v-model="atTime" small type="time" class="input">
<template #label>{{ $ts._poll.deadlineTime }}</template> <template #label>{{ i18n.ts._poll.deadlineTime }}</template>
</MkInput> </MkInput>
</section> </section>
<section v-else-if="expiration === 'after'"> <section v-else-if="expiration === 'after'">
<MkInput v-model="after" small type="number" class="input"> <MkInput v-model="after" small type="number" class="input">
<template #label>{{ $ts._poll.duration }}</template> <template #label>{{ i18n.ts._poll.duration }}</template>
</MkInput> </MkInput>
<MkSelect v-model="unit" small> <MkSelect v-model="unit" small>
<option value="second">{{ $ts._time.second }}</option> <option value="second">{{ i18n.ts._time.second }}</option>
<option value="minute">{{ $ts._time.minute }}</option> <option value="minute">{{ i18n.ts._time.minute }}</option>
<option value="hour">{{ $ts._time.hour }}</option> <option value="hour">{{ i18n.ts._time.hour }}</option>
<option value="day">{{ $ts._time.day }}</option> <option value="day">{{ i18n.ts._time.day }}</option>
</MkSelect> </MkSelect>
</section> </section>
</div> </div>
@ -55,6 +55,7 @@ import MkSwitch from './form/switch.vue';
import MkButton from './ui/button.vue'; import MkButton from './ui/button.vue';
import { formatDateTimeString } from '@/scripts/format-time-string'; import { formatDateTimeString } from '@/scripts/format-time-string';
import { addTime } from '@/scripts/time'; import { addTime } from '@/scripts/time';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
modelValue: { modelValue: {

View file

@ -13,97 +13,77 @@
<p v-if="!readOnly"> <p v-if="!readOnly">
<span>{{ $t('_poll.totalVotes', { n: total }) }}</span> <span>{{ $t('_poll.totalVotes', { n: total }) }}</span>
<span> · </span> <span> · </span>
<a v-if="!closed && !isVoted" @click="showResult = !showResult">{{ showResult ? $ts._poll.vote : $ts._poll.showResult }}</a> <a v-if="!closed && !isVoted" @click="showResult = !showResult">{{ showResult ? i18n.ts._poll.vote : i18n.ts._poll.showResult }}</a>
<span v-if="isVoted">{{ $ts._poll.voted }}</span> <span v-if="isVoted">{{ i18n.ts._poll.voted }}</span>
<span v-else-if="closed">{{ $ts._poll.closed }}</span> <span v-else-if="closed">{{ i18n.ts._poll.closed }}</span>
<span v-if="remaining > 0"> · {{ timer }}</span> <span v-if="remaining > 0"> · {{ timer }}</span>
</p> </p>
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts" setup>
import { computed, defineComponent, onUnmounted, ref, toRef } from 'vue'; import { computed, onUnmounted, ref, toRef } from 'vue';
import * as misskey from 'misskey-js';
import { sum } from '@/scripts/array'; import { sum } from '@/scripts/array';
import { pleaseLogin } from '@/scripts/please-login'; import { pleaseLogin } from '@/scripts/please-login';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { useInterval } from '@/scripts/use-interval'; import { useInterval } from '@/scripts/use-interval';
export default defineComponent({ const props = defineProps<{
props: { note: misskey.entities.Note;
note: { readOnly?: boolean;
type: Object, }>();
required: true,
},
readOnly: {
type: Boolean,
required: false,
default: false,
},
},
setup(props) { const remaining = ref(-1);
const remaining = ref(-1);
const total = computed(() => sum(props.note.poll.choices.map(x => x.votes))); const total = computed(() => sum(props.note.poll.choices.map(x => x.votes)));
const closed = computed(() => remaining.value === 0); const closed = computed(() => remaining.value === 0);
const isVoted = computed(() => !props.note.poll.multiple && props.note.poll.choices.some(c => c.isVoted)); const isVoted = computed(() => !props.note.poll.multiple && props.note.poll.choices.some(c => c.isVoted));
const timer = computed(() => i18n.t( const timer = computed(() => i18n.t(
remaining.value >= 86400 ? '_poll.remainingDays' : remaining.value >= 86400 ? '_poll.remainingDays' :
remaining.value >= 3600 ? '_poll.remainingHours' : remaining.value >= 3600 ? '_poll.remainingHours' :
remaining.value >= 60 ? '_poll.remainingMinutes' : '_poll.remainingSeconds', { remaining.value >= 60 ? '_poll.remainingMinutes' : '_poll.remainingSeconds', {
s: Math.floor(remaining.value % 60), s: Math.floor(remaining.value % 60),
m: Math.floor(remaining.value / 60) % 60, m: Math.floor(remaining.value / 60) % 60,
h: Math.floor(remaining.value / 3600) % 24, h: Math.floor(remaining.value / 3600) % 24,
d: Math.floor(remaining.value / 86400), d: Math.floor(remaining.value / 86400),
})); }));
const showResult = ref(props.readOnly || isVoted.value); const showResult = ref(props.readOnly || isVoted.value);
// //
if (props.note.poll.expiresAt) { if (props.note.poll.expiresAt) {
const tick = () => { const tick = () => {
remaining.value = Math.floor(Math.max(new Date(props.note.poll.expiresAt).getTime() - Date.now(), 0) / 1000); remaining.value = Math.floor(Math.max(new Date(props.note.poll.expiresAt).getTime() - Date.now(), 0) / 1000);
if (remaining.value === 0) { if (remaining.value === 0) {
showResult.value = true; showResult.value = true;
}
};
useInterval(tick, 3000, {
immediate: true,
afterMounted: false,
});
} }
};
const vote = async (id) => { useInterval(tick, 3000, {
pleaseLogin(); immediate: true,
afterMounted: false,
});
}
if (props.readOnly || closed.value || isVoted.value) return; const vote = async (id) => {
pleaseLogin();
const { canceled } = await os.confirm({ if (props.readOnly || closed.value || isVoted.value) return;
type: 'question',
text: i18n.t('voteConfirm', { choice: props.note.poll.choices[id].text }),
});
if (canceled) return;
await os.api('notes/polls/vote', { const { canceled } = await os.confirm({
noteId: props.note.id, type: 'question',
choice: id, text: i18n.t('voteConfirm', { choice: props.note.poll.choices[id].text }),
}); });
if (!showResult.value) showResult.value = !props.note.poll.multiple; if (canceled) return;
};
return { await os.api('notes/polls/vote', {
remaining, noteId: props.note.id,
showResult, choice: id,
total, });
isVoted, if (!showResult.value) showResult.value = !props.note.poll.multiple;
closed, };
timer,
vote,
};
},
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View file

@ -1,8 +1,10 @@
<template> <template>
<div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ $ts.remoteUserCaution }}<a class="link" :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div> <div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ i18n.ts.remoteUserCaution }}<a class="link" :href="href" rel="nofollow noopener" target="_blank">{{ i18n.ts.showOnRemote }}</a></div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { i18n } from '@/i18n';
defineProps<{ defineProps<{
href: string; href: string;
}>(); }>();

View file

@ -1,11 +1,12 @@
<template> <template>
<XModalWindow ref="dialog" <XModalWindow
ref="dialog"
:width="370" :width="370"
:height="400" :height="400"
@close="onClose" @close="onClose"
@closed="emit('closed')" @closed="emit('closed')"
> >
<template #header>{{ $ts.login }}</template> <template #header>{{ i18n.ts.login }}</template>
<MkSignin :auto-set="autoSet" :message="message" @login="onLogin"/> <MkSignin :auto-set="autoSet" :message="message" @login="onLogin"/>
</XModalWindow> </XModalWindow>
@ -13,15 +14,16 @@
<script lang="ts" setup> <script lang="ts" setup>
import { } from 'vue'; import { } from 'vue';
import XModalWindow from '@/components/ui/modal-window.vue';
import MkSignin from './signin.vue'; import MkSignin from './signin.vue';
import XModalWindow from '@/components/ui/modal-window.vue';
import { i18n } from '@/i18n';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
autoSet?: boolean; autoSet?: boolean;
message?: string, message?: string,
}>(), { }>(), {
autoSet: false, autoSet: false,
message: '' message: '',
}); });
const emit = defineEmits<{ const emit = defineEmits<{

View file

@ -1,11 +1,12 @@
<template> <template>
<XModalWindow ref="dialog" <XModalWindow
ref="dialog"
:width="366" :width="366"
:height="500" :height="500"
@close="dialog.close()" @close="dialog.close()"
@closed="$emit('closed')" @closed="$emit('closed')"
> >
<template #header>{{ $ts.signup }}</template> <template #header>{{ i18n.ts.signup }}</template>
<div class="_monolithic_"> <div class="_monolithic_">
<div class="_section"> <div class="_section">
@ -17,8 +18,9 @@
<script lang="ts" setup> <script lang="ts" setup>
import { } from 'vue'; import { } from 'vue';
import XModalWindow from '@/components/ui/modal-window.vue';
import XSignup from './signup.vue'; import XSignup from './signup.vue';
import XModalWindow from '@/components/ui/modal-window.vue';
import { i18n } from '@/i18n';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
autoSet?: boolean; autoSet?: boolean;

View file

@ -1,65 +1,65 @@
<template> <template>
<form class="qlvuhzng _formRoot" autocomplete="new-password" @submit.prevent="onSubmit"> <form class="qlvuhzng _formRoot" autocomplete="new-password" @submit.prevent="onSubmit">
<MkInput v-if="instance.disableRegistration" v-model="invitationCode" class="_formBlock" type="text" :spellcheck="false" required> <MkInput v-if="instance.disableRegistration" v-model="invitationCode" class="_formBlock" type="text" :spellcheck="false" required>
<template #label>{{ $ts.invitationCode }}</template> <template #label>{{ i18n.ts.invitationCode }}</template>
<template #prefix><i class="fas fa-key"></i></template> <template #prefix><i class="fas fa-key"></i></template>
</MkInput> </MkInput>
<MkInput v-model="username" class="_formBlock" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :spellcheck="false" required data-cy-signup-username @update:modelValue="onChangeUsername"> <MkInput v-model="username" class="_formBlock" type="text" pattern="^[a-zA-Z0-9_]{1,20}$" :spellcheck="false" required data-cy-signup-username @update:modelValue="onChangeUsername">
<template #label>{{ $ts.username }} <div v-tooltip:dialog="$ts.usernameInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template> <template #label>{{ i18n.ts.username }} <div v-tooltip:dialog="i18n.ts.usernameInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template>
<template #prefix>@</template> <template #prefix>@</template>
<template #suffix>@{{ host }}</template> <template #suffix>@{{ host }}</template>
<template #caption> <template #caption>
<span v-if="usernameState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ $ts.checking }}</span> <span v-if="usernameState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ i18n.ts.checking }}</span>
<span v-else-if="usernameState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span> <span v-else-if="usernameState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.available }}</span>
<span v-else-if="usernameState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span> <span v-else-if="usernameState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.unavailable }}</span>
<span v-else-if="usernameState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span> <span v-else-if="usernameState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.error }}</span>
<span v-else-if="usernameState === 'invalid-format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.usernameInvalidFormat }}</span> <span v-else-if="usernameState === 'invalid-format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.usernameInvalidFormat }}</span>
<span v-else-if="usernameState === 'min-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooShort }}</span> <span v-else-if="usernameState === 'min-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.tooShort }}</span>
<span v-else-if="usernameState === 'max-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.tooLong }}</span> <span v-else-if="usernameState === 'max-range'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.tooLong }}</span>
</template> </template>
</MkInput> </MkInput>
<MkInput v-if="instance.emailRequiredForSignup" v-model="email" class="_formBlock" :debounce="true" type="email" :spellcheck="false" required data-cy-signup-email @update:modelValue="onChangeEmail"> <MkInput v-if="instance.emailRequiredForSignup" v-model="email" class="_formBlock" :debounce="true" type="email" :spellcheck="false" required data-cy-signup-email @update:modelValue="onChangeEmail">
<template #label>{{ $ts.emailAddress }} <div v-tooltip:dialog="$ts._signup.emailAddressInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template> <template #label>{{ i18n.ts.emailAddress }} <div v-tooltip:dialog="i18n.ts._signup.emailAddressInfo" class="_button _help"><i class="far fa-question-circle"></i></div></template>
<template #prefix><i class="fas fa-envelope"></i></template> <template #prefix><i class="fas fa-envelope"></i></template>
<template #caption> <template #caption>
<span v-if="emailState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ $ts.checking }}</span> <span v-if="emailState === 'wait'" style="color:#999"><i class="fas fa-spinner fa-pulse fa-fw"></i> {{ i18n.ts.checking }}</span>
<span v-else-if="emailState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.available }}</span> <span v-else-if="emailState === 'ok'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.available }}</span>
<span v-else-if="emailState === 'unavailable:used'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.used }}</span> <span v-else-if="emailState === 'unavailable:used'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.used }}</span>
<span v-else-if="emailState === 'unavailable:format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.format }}</span> <span v-else-if="emailState === 'unavailable:format'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.format }}</span>
<span v-else-if="emailState === 'unavailable:disposable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.disposable }}</span> <span v-else-if="emailState === 'unavailable:disposable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.disposable }}</span>
<span v-else-if="emailState === 'unavailable:mx'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.mx }}</span> <span v-else-if="emailState === 'unavailable:mx'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.mx }}</span>
<span v-else-if="emailState === 'unavailable:smtp'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts._emailUnavailable.smtp }}</span> <span v-else-if="emailState === 'unavailable:smtp'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts._emailUnavailable.smtp }}</span>
<span v-else-if="emailState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.unavailable }}</span> <span v-else-if="emailState === 'unavailable'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.unavailable }}</span>
<span v-else-if="emailState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.error }}</span> <span v-else-if="emailState === 'error'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.error }}</span>
</template> </template>
</MkInput> </MkInput>
<MkInput v-model="password" class="_formBlock" type="password" autocomplete="new-password" required data-cy-signup-password @update:modelValue="onChangePassword"> <MkInput v-model="password" class="_formBlock" type="password" autocomplete="new-password" required data-cy-signup-password @update:modelValue="onChangePassword">
<template #label>{{ $ts.password }}</template> <template #label>{{ i18n.ts.password }}</template>
<template #prefix><i class="fas fa-lock"></i></template> <template #prefix><i class="fas fa-lock"></i></template>
<template #caption> <template #caption>
<span v-if="passwordStrength == 'low'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.weakPassword }}</span> <span v-if="passwordStrength == 'low'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.weakPassword }}</span>
<span v-if="passwordStrength == 'medium'" style="color: var(--warn)"><i class="fas fa-check fa-fw"></i> {{ $ts.normalPassword }}</span> <span v-if="passwordStrength == 'medium'" style="color: var(--warn)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.normalPassword }}</span>
<span v-if="passwordStrength == 'high'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.strongPassword }}</span> <span v-if="passwordStrength == 'high'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.strongPassword }}</span>
</template> </template>
</MkInput> </MkInput>
<MkInput v-model="retypedPassword" class="_formBlock" type="password" autocomplete="new-password" required data-cy-signup-password-retype @update:modelValue="onChangePasswordRetype"> <MkInput v-model="retypedPassword" class="_formBlock" type="password" autocomplete="new-password" required data-cy-signup-password-retype @update:modelValue="onChangePasswordRetype">
<template #label>{{ $ts.password }} ({{ $ts.retype }})</template> <template #label>{{ i18n.ts.password }} ({{ i18n.ts.retype }})</template>
<template #prefix><i class="fas fa-lock"></i></template> <template #prefix><i class="fas fa-lock"></i></template>
<template #caption> <template #caption>
<span v-if="passwordRetypeState == 'match'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ $ts.passwordMatched }}</span> <span v-if="passwordRetypeState == 'match'" style="color: var(--success)"><i class="fas fa-check fa-fw"></i> {{ i18n.ts.passwordMatched }}</span>
<span v-if="passwordRetypeState == 'not-match'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ $ts.passwordNotMatched }}</span> <span v-if="passwordRetypeState == 'not-match'" style="color: var(--error)"><i class="fas fa-exclamation-triangle fa-fw"></i> {{ i18n.ts.passwordNotMatched }}</span>
</template> </template>
</MkInput> </MkInput>
<MkSwitch v-if="instance.tosUrl" v-model="ToSAgreement" class="_formBlock tou"> <MkSwitch v-if="instance.tosUrl" v-model="ToSAgreement" class="_formBlock tou">
<I18n :src="$ts.agreeTo"> <I18n :src="i18n.ts.agreeTo">
<template #0> <template #0>
<a :href="instance.tosUrl" class="_link" target="_blank">{{ $ts.tos }}</a> <a :href="instance.tosUrl" class="_link" target="_blank">{{ i18n.ts.tos }}</a>
</template> </template>
</I18n> </I18n>
</MkSwitch> </MkSwitch>
<MkCaptcha v-if="instance.enableHcaptcha" ref="hcaptcha" v-model="hCaptchaResponse" class="_formBlock captcha" provider="hcaptcha" :sitekey="instance.hcaptchaSiteKey"/> <MkCaptcha v-if="instance.enableHcaptcha" ref="hcaptcha" v-model="hCaptchaResponse" class="_formBlock captcha" provider="hcaptcha" :sitekey="instance.hcaptchaSiteKey"/>
<MkCaptcha v-if="instance.enableRecaptcha" ref="recaptcha" v-model="reCaptchaResponse" class="_formBlock captcha" provider="recaptcha" :sitekey="instance.recaptchaSiteKey"/> <MkCaptcha v-if="instance.enableRecaptcha" ref="recaptcha" v-model="reCaptchaResponse" class="_formBlock captcha" provider="recaptcha" :sitekey="instance.recaptchaSiteKey"/>
<MkButton class="_formBlock" type="submit" :disabled="shouldDisableSubmitting" gradate data-cy-signup-submit>{{ $ts.start }}</MkButton> <MkButton class="_formBlock" type="submit" :disabled="shouldDisableSubmitting" gradate data-cy-signup-submit>{{ i18n.ts.start }}</MkButton>
</form> </form>
</template> </template>

View file

@ -1,8 +1,8 @@
<template> <template>
<div class="wrmlmaau" :class="{ collapsed }"> <div class="wrmlmaau" :class="{ collapsed }">
<div class="body"> <div class="body">
<span v-if="note.isHidden" style="opacity: 0.5">({{ $ts.private }})</span> <span v-if="note.isHidden" style="opacity: 0.5">({{ i18n.ts.private }})</span>
<span v-if="note.deletedAt" style="opacity: 0.5">({{ $ts.deleted }})</span> <span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
<MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="fas fa-reply"></i></MkA> <MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="fas fa-reply"></i></MkA>
<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/> <Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA> <MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
@ -12,20 +12,21 @@
<XMediaList :media-list="note.files"/> <XMediaList :media-list="note.files"/>
</details> </details>
<details v-if="note.poll"> <details v-if="note.poll">
<summary>{{ $ts.poll }}</summary> <summary>{{ i18n.ts.poll }}</summary>
<XPoll :note="note"/> <XPoll :note="note"/>
</details> </details>
<button v-if="collapsed" class="fade _button" @click="collapsed = false"> <button v-if="collapsed" class="fade _button" @click="collapsed = false">
<span>{{ $ts.showMore }}</span> <span>{{ i18n.ts.showMore }}</span>
</button> </button>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { } from 'vue'; import { } from 'vue';
import * as misskey from 'misskey-js';
import XPoll from './poll.vue'; import XPoll from './poll.vue';
import XMediaList from './media-list.vue'; import XMediaList from './media-list.vue';
import * as misskey from 'misskey-js'; import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
note: misskey.entities.Note; note: misskey.entities.Note;

View file

@ -25,23 +25,25 @@ let tagsEl = $ref<HTMLElement | null>(null);
let width = $ref(300); let width = $ref(300);
watch($$(available), () => { watch($$(available), () => {
window.TagCanvas.Start(idForCanvas, idForTags, { try {
textColour: '#ffffff', window.TagCanvas.Start(idForCanvas, idForTags, {
outlineColour: tinycolor(computedStyle.getPropertyValue('--accent')).toHexString(), textColour: '#ffffff',
outlineRadius: 10, outlineColour: tinycolor(computedStyle.getPropertyValue('--accent')).toHexString(),
initial: [-0.030, -0.010], outlineRadius: 10,
frontSelect: true, initial: [-0.030, -0.010],
imageRadius: 8, frontSelect: true,
//dragControl: true, imageRadius: 8,
dragThreshold: 3, //dragControl: true,
wheelZoom: false, dragThreshold: 3,
reverse: true, wheelZoom: false,
depth: 0.5, reverse: true,
maxSpeed: 0.2, depth: 0.5,
minSpeed: 0.003, maxSpeed: 0.2,
stretchX: 0.8, minSpeed: 0.003,
stretchY: 0.8, stretchX: 0.8,
}); stretchY: 0.8,
});
} catch (e) {}
}); });
onMounted(() => { onMounted(() => {
@ -58,7 +60,7 @@ onMounted(() => {
}); });
onBeforeUnmount(() => { onBeforeUnmount(() => {
window.TagCanvas.Delete(idForCanvas); if (window.TagCanvas) window.TagCanvas.Delete(idForCanvas);
}); });
defineExpose({ defineExpose({

View file

@ -46,7 +46,7 @@
</button> </button>
</template> </template>
<span v-if="items2.length === 0" class="none item"> <span v-if="items2.length === 0" class="none item">
<span>{{ $ts.none }}</span> <span>{{ i18n.ts.none }}</span>
</span> </span>
</div> </div>
<div v-if="childMenu" class="child"> <div v-if="childMenu" class="child">
@ -61,6 +61,8 @@ import { focusPrev, focusNext } from '@/scripts/focus';
import FormSwitch from '@/components/form/switch.vue'; import FormSwitch from '@/components/form/switch.vue';
import { MenuItem, InnerMenuItem, MenuPending, MenuAction } from '@/types/menu'; import { MenuItem, InnerMenuItem, MenuPending, MenuAction } from '@/types/menu';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
const XChild = defineAsyncComponent(() => import('./menu.child.vue')); const XChild = defineAsyncComponent(() => import('./menu.child.vue'));
const props = defineProps<{ const props = defineProps<{

View file

@ -8,7 +8,7 @@
<slot name="empty"> <slot name="empty">
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/info.jpg" class="_ghost" alt="Error"/> <img src="/static-assets/badges/info.jpg" class="_ghost" alt="Error"/>
<div>{{ $ts.nothing }}</div> <div>{{ i18n.ts.nothing }}</div>
</div> </div>
</slot> </slot>
</div> </div>
@ -16,14 +16,14 @@
<div v-else ref="rootEl"> <div v-else ref="rootEl">
<div v-show="pagination.reversed && more" key="_more_" class="cxiknjgy _gap"> <div v-show="pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
<MkButton v-if="!moreFetching" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMoreAhead"> <MkButton v-if="!moreFetching" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMoreAhead">
{{ $ts.loadMore }} {{ i18n.ts.loadMore }}
</MkButton> </MkButton>
<MkLoading v-else class="loading"/> <MkLoading v-else class="loading"/>
</div> </div>
<slot :items="items"></slot> <slot :items="items"></slot>
<div v-show="!pagination.reversed && more" key="_more_" class="cxiknjgy _gap"> <div v-show="!pagination.reversed && more" key="_more_" class="cxiknjgy _gap">
<MkButton v-if="!moreFetching" v-appear="($store.state.enableInfiniteScroll && !disableAutoLoad) ? fetchMore : null" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMore"> <MkButton v-if="!moreFetching" v-appear="($store.state.enableInfiniteScroll && !disableAutoLoad) ? fetchMore : null" class="button" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMore">
{{ $ts.loadMore }} {{ i18n.ts.loadMore }}
</MkButton> </MkButton>
<MkLoading v-else class="loading"/> <MkLoading v-else class="loading"/>
</div> </div>
@ -37,6 +37,7 @@ import * as misskey from 'misskey-js';
import * as os from '@/os'; import * as os from '@/os';
import { onScrollTop, isTopVisible, getScrollPosition, getScrollContainer } from '@/scripts/scroll'; import { onScrollTop, isTopVisible, getScrollPosition, getScrollContainer } from '@/scripts/scroll';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import { i18n } from '@/i18n';
const SECOND_FETCH_LIMIT = 30; const SECOND_FETCH_LIMIT = 30;

View file

@ -170,6 +170,7 @@ function onHeaderMousedown(evt: MouseEvent) {
beforeClickedAt = Date.now(); beforeClickedAt = Date.now();
const main = rootEl; const main = rootEl;
if (main == null) return;
if (!contains(main, document.activeElement)) main.focus(); if (!contains(main, document.activeElement)) main.focus();

View file

@ -1,10 +1,10 @@
<template> <template>
<MkModal ref="modal" :z-priority="'middle'" @click="$refs.modal.close()" @closed="$emit('closed')"> <MkModal ref="modal" :z-priority="'middle'" @click="$refs.modal.close()" @closed="$emit('closed')">
<div class="ewlycnyt"> <div class="ewlycnyt">
<div class="title"><MkSparkle>{{ $ts.misskeyUpdated }}</MkSparkle></div> <div class="title"><MkSparkle>{{ i18n.ts.misskeyUpdated }}</MkSparkle></div>
<div class="version">{{ version }}🚀</div> <div class="version">{{ version }}🚀</div>
<MkButton full @click="whatIsNew">{{ $ts.whatIsNew }}</MkButton> <MkButton full @click="whatIsNew">{{ i18n.ts.whatIsNew }}</MkButton>
<MkButton class="gotIt" primary full @click="$refs.modal.close()">{{ $ts.gotIt }}</MkButton> <MkButton class="gotIt" primary full @click="$refs.modal.close()">{{ i18n.ts.gotIt }}</MkButton>
</div> </div>
</MkModal> </MkModal>
</template> </template>
@ -15,8 +15,9 @@ import MkModal from '@/components/ui/modal.vue';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import MkSparkle from '@/components/sparkle.vue'; import MkSparkle from '@/components/sparkle.vue';
import { version } from '@/config'; import { version } from '@/config';
import { i18n } from '@/i18n';
const modal = ref(); const modal = ref<InstanceType<typeof MkModal>>();
const whatIsNew = () => { const whatIsNew = () => {
modal.value.close(); modal.value.close();

View file

@ -1,6 +1,6 @@
<template> <template>
<div v-if="playerEnabled" class="player" :style="`padding: ${(player.height || 0) / (player.width || 1) * 100}% 0 0`"> <div v-if="playerEnabled" class="player" :style="`padding: ${(player.height || 0) / (player.width || 1) * 100}% 0 0`">
<button class="disablePlayer" :title="$ts.disablePlayer" @click="playerEnabled = false"><i class="fas fa-times"></i></button> <button class="disablePlayer" :title="i18n.ts.disablePlayer" @click="playerEnabled = false"><i class="fas fa-times"></i></button>
<iframe :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" :width="player.width || '100%'" :heigth="player.height || 250" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen/> <iframe :src="player.url + (player.url.match(/\?/) ? '&autoplay=1&auto_play=1' : '?autoplay=1&auto_play=1')" :width="player.width || '100%'" :heigth="player.height || 250" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen/>
</div> </div>
<div v-else-if="tweetId && tweetExpanded" ref="twitter" class="twitter"> <div v-else-if="tweetId && tweetExpanded" ref="twitter" class="twitter">
@ -10,7 +10,7 @@
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
<component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url"> <component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
<div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`"> <div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`">
<button v-if="!playerEnabled && player.url" class="_button" :title="$ts.enablePlayer" @click.prevent="playerEnabled = true"><i class="fas fa-play-circle"></i></button> <button v-if="!playerEnabled && player.url" class="_button" :title="i18n.ts.enablePlayer" @click.prevent="playerEnabled = true"><i class="fas fa-play-circle"></i></button>
</div> </div>
<article> <article>
<header> <header>
@ -26,7 +26,7 @@
</transition> </transition>
<div v-if="tweetId" class="expandTweet"> <div v-if="tweetId" class="expandTweet">
<a @click="tweetExpanded = true"> <a @click="tweetExpanded = true">
<i class="fab fa-twitter"></i> {{ $ts.expandTweet }} <i class="fab fa-twitter"></i> {{ i18n.ts.expandTweet }}
</a> </a>
</div> </div>
</div> </div>
@ -35,6 +35,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, onUnmounted } from 'vue'; import { onMounted, onUnmounted } from 'vue';
import { url as local, lang } from '@/config'; import { url as local, lang } from '@/config';
import { i18n } from '@/i18n';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
url: string; url: string;

View file

@ -10,17 +10,17 @@
<div v-if="user.description" class="mfm"> <div v-if="user.description" class="mfm">
<Mfm :text="user.description" :author="user" :i="$i" :custom-emojis="user.emojis"/> <Mfm :text="user.description" :author="user" :i="$i" :custom-emojis="user.emojis"/>
</div> </div>
<span v-else style="opacity: 0.7;">{{ $ts.noAccountDescription }}</span> <span v-else style="opacity: 0.7;">{{ i18n.ts.noAccountDescription }}</span>
</div> </div>
<div class="status"> <div class="status">
<div> <div>
<p>{{ $ts.notes }}</p><span>{{ user.notesCount }}</span> <p>{{ i18n.ts.notes }}</p><span>{{ user.notesCount }}</span>
</div> </div>
<div> <div>
<p>{{ $ts.following }}</p><span>{{ user.followingCount }}</span> <p>{{ i18n.ts.following }}</p><span>{{ user.followingCount }}</span>
</div> </div>
<div> <div>
<p>{{ $ts.followers }}</p><span>{{ user.followersCount }}</span> <p>{{ i18n.ts.followers }}</p><span>{{ user.followersCount }}</span>
</div> </div>
</div> </div>
<MkFollowButton v-if="$i && user.id != $i.id" class="koudoku-button" :user="user" mini/> <MkFollowButton v-if="$i && user.id != $i.id" class="koudoku-button" :user="user" mini/>
@ -31,6 +31,7 @@
import * as misskey from 'misskey-js'; import * as misskey from 'misskey-js';
import MkFollowButton from './follow-button.vue'; import MkFollowButton from './follow-button.vue';
import { userPage } from '@/filters/user'; import { userPage } from '@/filters/user';
import { i18n } from '@/i18n';
defineProps<{ defineProps<{
user: misskey.entities.UserDetailed; user: misskey.entities.UserDetailed;

View file

@ -3,7 +3,7 @@
<template #empty> <template #empty>
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/> <img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/>
<div>{{ $ts.noUsers }}</div> <div>{{ i18n.ts.noUsers }}</div>
</div> </div>
</template> </template>
@ -18,9 +18,9 @@
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from 'vue'; import { ref } from 'vue';
import MkUserInfo from '@/components/user-info.vue'; import MkUserInfo from '@/components/user-info.vue';
import MkPagination from '@/components/ui/pagination.vue'; import MkPagination, { Paging } from '@/components/ui/pagination.vue';
import { Paging } from '@/components/ui/pagination.vue';
import { userPage } from '@/filters/user'; import { userPage } from '@/filters/user';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
pagination: Paging; pagination: Paging;

View file

@ -1,5 +1,6 @@
<template> <template>
<XModalWindow ref="dialogEl" <XModalWindow
ref="dialogEl"
:with-ok-button="true" :with-ok-button="true"
:ok-button-disabled="selected == null" :ok-button-disabled="selected == null"
@click="cancel()" @click="cancel()"
@ -7,16 +8,16 @@
@ok="ok()" @ok="ok()"
@closed="$emit('closed')" @closed="$emit('closed')"
> >
<template #header>{{ $ts.selectUser }}</template> <template #header>{{ i18n.ts.selectUser }}</template>
<div class="tbhwbxda"> <div class="tbhwbxda">
<div class="form"> <div class="form">
<FormSplit :min-width="170"> <FormSplit :min-width="170">
<MkInput v-model="username" :autofocus="true" @update:modelValue="search"> <MkInput v-model="username" :autofocus="true" @update:modelValue="search">
<template #label>{{ $ts.username }}</template> <template #label>{{ i18n.ts.username }}</template>
<template #prefix>@</template> <template #prefix>@</template>
</MkInput> </MkInput>
<MkInput v-model="host" @update:modelValue="search"> <MkInput v-model="host" @update:modelValue="search">
<template #label>{{ $ts.host }}</template> <template #label>{{ i18n.ts.host }}</template>
<template #prefix>@</template> <template #prefix>@</template>
</MkInput> </MkInput>
</FormSplit> </FormSplit>
@ -32,7 +33,7 @@
</div> </div>
</div> </div>
<div v-else class="empty"> <div v-else class="empty">
<span>{{ $ts.noUsers }}</span> <span>{{ i18n.ts.noUsers }}</span>
</div> </div>
</div> </div>
<div v-if="username == '' && host == ''" class="recent"> <div v-if="username == '' && host == ''" class="recent">
@ -58,6 +59,7 @@ import FormSplit from '@/components/form/split.vue';
import XModalWindow from '@/components/ui/modal-window.vue'; import XModalWindow from '@/components/ui/modal-window.vue';
import * as os from '@/os'; import * as os from '@/os';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { i18n } from '@/i18n';
const emit = defineEmits<{ const emit = defineEmits<{
(ev: 'ok', selected: misskey.entities.UserDetailed): void; (ev: 'ok', selected: misskey.entities.UserDetailed): void;
@ -81,7 +83,7 @@ const search = () => {
username: username, username: username,
host: host, host: host,
limit: 10, limit: 10,
detail: false detail: false,
}).then(_users => { }).then(_users => {
users = _users; users = _users;
}); });

View file

@ -4,37 +4,37 @@
<button key="public" class="_button" :class="{ active: v === 'public' }" data-index="1" @click="choose('public')"> <button key="public" class="_button" :class="{ active: v === 'public' }" data-index="1" @click="choose('public')">
<div><i class="fas fa-globe"></i></div> <div><i class="fas fa-globe"></i></div>
<div> <div>
<span>{{ $ts._visibility.public }}</span> <span>{{ i18n.ts._visibility.public }}</span>
<span>{{ $ts._visibility.publicDescription }}</span> <span>{{ i18n.ts._visibility.publicDescription }}</span>
</div> </div>
</button> </button>
<button key="home" class="_button" :class="{ active: v === 'home' }" data-index="2" @click="choose('home')"> <button key="home" class="_button" :class="{ active: v === 'home' }" data-index="2" @click="choose('home')">
<div><i class="fas fa-home"></i></div> <div><i class="fas fa-home"></i></div>
<div> <div>
<span>{{ $ts._visibility.home }}</span> <span>{{ i18n.ts._visibility.home }}</span>
<span>{{ $ts._visibility.homeDescription }}</span> <span>{{ i18n.ts._visibility.homeDescription }}</span>
</div> </div>
</button> </button>
<button key="followers" class="_button" :class="{ active: v === 'followers' }" data-index="3" @click="choose('followers')"> <button key="followers" class="_button" :class="{ active: v === 'followers' }" data-index="3" @click="choose('followers')">
<div><i class="fas fa-unlock"></i></div> <div><i class="fas fa-unlock"></i></div>
<div> <div>
<span>{{ $ts._visibility.followers }}</span> <span>{{ i18n.ts._visibility.followers }}</span>
<span>{{ $ts._visibility.followersDescription }}</span> <span>{{ i18n.ts._visibility.followersDescription }}</span>
</div> </div>
</button> </button>
<button key="specified" :disabled="localOnly" class="_button" :class="{ active: v === 'specified' }" data-index="4" @click="choose('specified')"> <button key="specified" :disabled="localOnly" class="_button" :class="{ active: v === 'specified' }" data-index="4" @click="choose('specified')">
<div><i class="fas fa-envelope"></i></div> <div><i class="fas fa-envelope"></i></div>
<div> <div>
<span>{{ $ts._visibility.specified }}</span> <span>{{ i18n.ts._visibility.specified }}</span>
<span>{{ $ts._visibility.specifiedDescription }}</span> <span>{{ i18n.ts._visibility.specifiedDescription }}</span>
</div> </div>
</button> </button>
<div class="divider"></div> <div class="divider"></div>
<button key="localOnly" class="_button localOnly" :class="{ active: localOnly }" data-index="5" @click="localOnly = !localOnly"> <button key="localOnly" class="_button localOnly" :class="{ active: localOnly }" data-index="5" @click="localOnly = !localOnly">
<div><i class="fas fa-biohazard"></i></div> <div><i class="fas fa-biohazard"></i></div>
<div> <div>
<span>{{ $ts._visibility.localOnly }}</span> <span>{{ i18n.ts._visibility.localOnly }}</span>
<span>{{ $ts._visibility.localOnlyDescription }}</span> <span>{{ i18n.ts._visibility.localOnlyDescription }}</span>
</div> </div>
<div><i :class="localOnly ? 'fas fa-toggle-on' : 'fas fa-toggle-off'"></i></div> <div><i :class="localOnly ? 'fas fa-toggle-on' : 'fas fa-toggle-off'"></i></div>
</button> </button>
@ -46,6 +46,7 @@
import { nextTick, watch } from 'vue'; import { nextTick, watch } from 'vue';
import * as misskey from 'misskey-js'; import * as misskey from 'misskey-js';
import MkModal from '@/components/ui/modal.vue'; import MkModal from '@/components/ui/modal.vue';
import { i18n } from '@/i18n';
const modal = $ref<InstanceType<typeof MkModal>>(); const modal = $ref<InstanceType<typeof MkModal>>();

View file

@ -3,11 +3,11 @@
<template v-if="edit"> <template v-if="edit">
<header> <header>
<MkSelect v-model="widgetAdderSelected" style="margin-bottom: var(--margin)" class="mk-widget-select"> <MkSelect v-model="widgetAdderSelected" style="margin-bottom: var(--margin)" class="mk-widget-select">
<template #label>{{ $ts.selectWidget }}</template> <template #label>{{ i18n.ts.selectWidget }}</template>
<option v-for="widget in widgetDefs" :key="widget" :value="widget">{{ i18n.t(`_widgets.${widget}`) }}</option> <option v-for="widget in widgetDefs" :key="widget" :value="widget">{{ i18n.t(`_widgets.${widget}`) }}</option>
</MkSelect> </MkSelect>
<MkButton inline primary class="mk-widget-add" @click="addWidget"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton> <MkButton inline primary class="mk-widget-add" @click="addWidget"><i class="fas fa-plus"></i> {{ i18n.ts.add }}</MkButton>
<MkButton inline @click="$emit('exit')">{{ $ts.close }}</MkButton> <MkButton inline @click="$emit('exit')">{{ i18n.ts.close }}</MkButton>
</header> </header>
<XDraggable <XDraggable
v-model="widgets_" v-model="widgets_"

View file

@ -13,6 +13,7 @@ type RouteDef = {
name?: string; name?: string;
hash?: string; hash?: string;
globalCacheKey?: string; globalCacheKey?: string;
children?: RouteDef[];
}; };
type ParsedPath = (string | { type ParsedPath = (string | {
@ -22,6 +23,8 @@ type ParsedPath = (string | {
optional?: boolean; optional?: boolean;
})[]; })[];
export type Resolved = { route: RouteDef; props: Map<string, string>; child?: Resolved; };
function parsePath(path: string): ParsedPath { function parsePath(path: string): ParsedPath {
const res = [] as ParsedPath; const res = [] as ParsedPath;
@ -51,8 +54,11 @@ export class Router extends EventEmitter<{
change: (ctx: { change: (ctx: {
beforePath: string; beforePath: string;
path: string; path: string;
route: RouteDef | null; resolved: Resolved;
props: Map<string, string> | null; key: string;
}) => void;
replace: (ctx: {
path: string;
key: string; key: string;
}) => void; }) => void;
push: (ctx: { push: (ctx: {
@ -65,12 +71,12 @@ export class Router extends EventEmitter<{
same: () => void; same: () => void;
}> { }> {
private routes: RouteDef[]; private routes: RouteDef[];
public current: Resolved;
public currentRef: ShallowRef<Resolved> = shallowRef();
public currentRoute: ShallowRef<RouteDef> = shallowRef();
private currentPath: string; private currentPath: string;
private currentComponent: Component | null = null;
private currentProps: Map<string, string> | null = null;
private currentKey = Date.now().toString(); private currentKey = Date.now().toString();
public currentRoute: ShallowRef<RouteDef | null> = shallowRef(null);
public navHook: ((path: string, flag?: any) => boolean) | null = null; public navHook: ((path: string, flag?: any) => boolean) | null = null;
constructor(routes: Router['routes'], currentPath: Router['currentPath']) { constructor(routes: Router['routes'], currentPath: Router['currentPath']) {
@ -78,10 +84,10 @@ export class Router extends EventEmitter<{
this.routes = routes; this.routes = routes;
this.currentPath = currentPath; this.currentPath = currentPath;
this.navigate(currentPath, null, true); this.navigate(currentPath, null, false);
} }
public resolve(path: string): { route: RouteDef; props: Map<string, string>; } | null { public resolve(path: string): Resolved | null {
let queryString: string | null = null; let queryString: string | null = null;
let hash: string | null = null; let hash: string | null = null;
if (path[0] === '/') path = path.substring(1); if (path[0] === '/') path = path.substring(1);
@ -96,77 +102,108 @@ export class Router extends EventEmitter<{
if (_DEV_) console.log('Routing: ', path, queryString); if (_DEV_) console.log('Routing: ', path, queryString);
const _parts = path.split('/').filter(part => part.length !== 0); function check(routes: RouteDef[], _parts: string[]): Resolved | null {
forEachRouteLoop:
for (const route of routes) {
let parts = [ ..._parts ];
const props = new Map<string, string>();
forEachRouteLoop: pathMatchLoop:
for (const route of this.routes) { for (const p of parsePath(route.path)) {
let parts = [ ..._parts ]; if (typeof p === 'string') {
const props = new Map<string, string>(); if (p === parts[0]) {
pathMatchLoop:
for (const p of parsePath(route.path)) {
if (typeof p === 'string') {
if (p === parts[0]) {
parts.shift();
} else {
continue forEachRouteLoop;
}
} else {
if (parts[0] == null && !p.optional) {
continue forEachRouteLoop;
}
if (p.wildcard) {
if (parts.length !== 0) {
props.set(p.name, safeURIDecode(parts.join('/')));
parts = [];
}
break pathMatchLoop;
} else {
if (p.startsWith) {
if (parts[0] == null || !parts[0].startsWith(p.startsWith)) continue forEachRouteLoop;
props.set(p.name, safeURIDecode(parts[0].substring(p.startsWith.length)));
parts.shift(); parts.shift();
} else { } else {
if (parts[0]) { continue forEachRouteLoop;
props.set(p.name, safeURIDecode(parts[0])); }
} else {
if (parts[0] == null && !p.optional) {
continue forEachRouteLoop;
}
if (p.wildcard) {
if (parts.length !== 0) {
props.set(p.name, safeURIDecode(parts.join('/')));
parts = [];
}
break pathMatchLoop;
} else {
if (p.startsWith) {
if (parts[0] == null || !parts[0].startsWith(p.startsWith)) continue forEachRouteLoop;
props.set(p.name, safeURIDecode(parts[0].substring(p.startsWith.length)));
parts.shift();
} else {
if (parts[0]) {
props.set(p.name, safeURIDecode(parts[0]));
}
parts.shift();
} }
parts.shift();
} }
} }
} }
}
if (parts.length !== 0) continue forEachRouteLoop; if (parts.length === 0) {
if (route.children) {
const child = check(route.children, []);
if (child) {
return {
route,
props,
child,
};
} else {
continue forEachRouteLoop;
}
}
if (route.hash != null && hash != null) { if (route.hash != null && hash != null) {
props.set(route.hash, safeURIDecode(hash)); props.set(route.hash, safeURIDecode(hash));
} }
if (route.query != null && queryString != null) { if (route.query != null && queryString != null) {
const queryObject = [...new URLSearchParams(queryString).entries()] const queryObject = [...new URLSearchParams(queryString).entries()]
.reduce((obj, entry) => ({ ...obj, [entry[0]]: entry[1] }), {}); .reduce((obj, entry) => ({ ...obj, [entry[0]]: entry[1] }), {});
for (const q in route.query) { for (const q in route.query) {
const as = route.query[q]; const as = route.query[q];
if (queryObject[q]) { if (queryObject[q]) {
props.set(as, safeURIDecode(queryObject[q])); props.set(as, safeURIDecode(queryObject[q]));
}
}
}
return {
route,
props,
};
} else {
if (route.children) {
const child = check(route.children, parts);
if (child) {
return {
route,
props,
child,
};
} else {
continue forEachRouteLoop;
}
} else {
continue forEachRouteLoop;
} }
} }
} }
return { return null;
route,
props,
};
} }
return null; const _parts = path.split('/').filter(part => part.length !== 0);
return check(this.routes, _parts);
} }
private navigate(path: string, key: string | null | undefined, initial = false) { private navigate(path: string, key: string | null | undefined, emitChange = true) {
const beforePath = this.currentPath; const beforePath = this.currentPath;
const beforeRoute = this.currentRoute.value;
this.currentPath = path; this.currentPath = path;
const res = this.resolve(this.currentPath); const res = this.resolve(this.currentPath);
@ -181,28 +218,21 @@ export class Router extends EventEmitter<{
const isSamePath = beforePath === path; const isSamePath = beforePath === path;
if (isSamePath && key == null) key = this.currentKey; if (isSamePath && key == null) key = this.currentKey;
this.currentComponent = res.route.component; this.current = res;
this.currentProps = res.props; this.currentRef.value = res;
this.currentRoute.value = res.route; this.currentRoute.value = res.route;
this.currentKey = this.currentRoute.value.globalCacheKey ?? key ?? Date.now().toString(); this.currentKey = res.route.globalCacheKey ?? key ?? path;
if (!initial) { if (emitChange) {
this.emit('change', { this.emit('change', {
beforePath, beforePath,
path, path,
route: this.currentRoute.value, resolved: res,
props: this.currentProps,
key: this.currentKey, key: this.currentKey,
}); });
} }
}
public getCurrentComponent() { return res;
return this.currentComponent;
}
public getCurrentProps() {
return this.currentProps;
} }
public getCurrentPath() { public getCurrentPath() {
@ -223,17 +253,23 @@ export class Router extends EventEmitter<{
const cancel = this.navHook(path, flag); const cancel = this.navHook(path, flag);
if (cancel) return; if (cancel) return;
} }
this.navigate(path, null); const res = this.navigate(path, null);
this.emit('push', { this.emit('push', {
beforePath, beforePath,
path, path,
route: this.currentRoute.value, route: res.route,
props: this.currentProps, props: res.props,
key: this.currentKey, key: this.currentKey,
}); });
} }
public change(path: string, key?: string | null) { public replace(path: string, key?: string | null, emitEvent = true) {
this.navigate(path, key); this.navigate(path, key);
if (emitEvent) {
this.emit('replace', {
path,
key: this.currentKey,
});
}
} }
} }

View file

@ -0,0 +1,7 @@
<template>
<div></div>
</template>
<script lang="ts" setup>
import { } from 'vue';
</script>

View file

@ -3,35 +3,35 @@
<div class="query"> <div class="query">
<MkInput v-model="host" :debounce="true" class=""> <MkInput v-model="host" :debounce="true" class="">
<template #prefix><i class="fas fa-search"></i></template> <template #prefix><i class="fas fa-search"></i></template>
<template #label>{{ $ts.host }}</template> <template #label>{{ i18n.ts.host }}</template>
</MkInput> </MkInput>
<FormSplit style="margin-top: var(--margin);"> <FormSplit style="margin-top: var(--margin);">
<MkSelect v-model="state"> <MkSelect v-model="state">
<template #label>{{ $ts.state }}</template> <template #label>{{ i18n.ts.state }}</template>
<option value="all">{{ $ts.all }}</option> <option value="all">{{ i18n.ts.all }}</option>
<option value="federating">{{ $ts.federating }}</option> <option value="federating">{{ i18n.ts.federating }}</option>
<option value="subscribing">{{ $ts.subscribing }}</option> <option value="subscribing">{{ i18n.ts.subscribing }}</option>
<option value="publishing">{{ $ts.publishing }}</option> <option value="publishing">{{ i18n.ts.publishing }}</option>
<option value="suspended">{{ $ts.suspended }}</option> <option value="suspended">{{ i18n.ts.suspended }}</option>
<option value="blocked">{{ $ts.blocked }}</option> <option value="blocked">{{ i18n.ts.blocked }}</option>
<option value="notResponding">{{ $ts.notResponding }}</option> <option value="notResponding">{{ i18n.ts.notResponding }}</option>
</MkSelect> </MkSelect>
<MkSelect v-model="sort"> <MkSelect v-model="sort">
<template #label>{{ $ts.sort }}</template> <template #label>{{ i18n.ts.sort }}</template>
<option value="+pubSub">{{ $ts.pubSub }} ({{ $ts.descendingOrder }})</option> <option value="+pubSub">{{ i18n.ts.pubSub }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-pubSub">{{ $ts.pubSub }} ({{ $ts.ascendingOrder }})</option> <option value="-pubSub">{{ i18n.ts.pubSub }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+notes">{{ $ts.notes }} ({{ $ts.descendingOrder }})</option> <option value="+notes">{{ i18n.ts.notes }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-notes">{{ $ts.notes }} ({{ $ts.ascendingOrder }})</option> <option value="-notes">{{ i18n.ts.notes }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+users">{{ $ts.users }} ({{ $ts.descendingOrder }})</option> <option value="+users">{{ i18n.ts.users }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-users">{{ $ts.users }} ({{ $ts.ascendingOrder }})</option> <option value="-users">{{ i18n.ts.users }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+following">{{ $ts.following }} ({{ $ts.descendingOrder }})</option> <option value="+following">{{ i18n.ts.following }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-following">{{ $ts.following }} ({{ $ts.ascendingOrder }})</option> <option value="-following">{{ i18n.ts.following }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+followers">{{ $ts.followers }} ({{ $ts.descendingOrder }})</option> <option value="+followers">{{ i18n.ts.followers }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-followers">{{ $ts.followers }} ({{ $ts.ascendingOrder }})</option> <option value="-followers">{{ i18n.ts.followers }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+caughtAt">{{ $ts.registeredAt }} ({{ $ts.descendingOrder }})</option> <option value="+caughtAt">{{ i18n.ts.registeredAt }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-caughtAt">{{ $ts.registeredAt }} ({{ $ts.ascendingOrder }})</option> <option value="-caughtAt">{{ i18n.ts.registeredAt }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+lastCommunicatedAt">{{ $ts.lastCommunication }} ({{ $ts.descendingOrder }})</option> <option value="+lastCommunicatedAt">{{ i18n.ts.lastCommunication }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-lastCommunicatedAt">{{ $ts.lastCommunication }} ({{ $ts.ascendingOrder }})</option> <option value="-lastCommunicatedAt">{{ i18n.ts.lastCommunication }} ({{ i18n.ts.ascendingOrder }})</option>
</MkSelect> </MkSelect>
</FormSplit> </FormSplit>
</div> </div>

View file

@ -13,7 +13,7 @@
</div> </div>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.description }}</template> <template #key>{{ i18n.ts.description }}</template>
<template #value>{{ $instance.description }}</template> <template #value>{{ $instance.description }}</template>
</MkKeyValue> </MkKeyValue>
@ -22,33 +22,33 @@
<template #key>Calckey</template> <template #key>Calckey</template>
<template #value>{{ version }}</template> <template #value>{{ version }}</template>
</MkKeyValue> </MkKeyValue>
<FormLink to="/about-misskey">{{ $ts.aboutMisskey }}</FormLink> <FormLink to="/about-misskey">{{ i18n.ts.aboutMisskey }}</FormLink>
</FormSection> </FormSection>
<FormSection> <FormSection>
<FormSplit> <FormSplit>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.administrator }}</template> <template #key>{{ i18n.ts.administrator }}</template>
<template #value>{{ $instance.maintainerName }}</template> <template #value>{{ $instance.maintainerName }}</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.contact }}</template> <template #key>{{ i18n.ts.contact }}</template>
<template #value>{{ $instance.maintainerEmail }}</template> <template #value>{{ $instance.maintainerEmail }}</template>
</MkKeyValue> </MkKeyValue>
</FormSplit> </FormSplit>
<FormLink v-if="$instance.tosUrl" :to="$instance.tosUrl" class="_formBlock" external>{{ $ts.tos }}</FormLink> <FormLink v-if="$instance.tosUrl" :to="$instance.tosUrl" class="_formBlock" external>{{ i18n.ts.tos }}</FormLink>
</FormSection> </FormSection>
<FormSuspense :p="initStats"> <FormSuspense :p="initStats">
<FormSection> <FormSection>
<template #label>{{ $ts.statistics }}</template> <template #label>{{ i18n.ts.statistics }}</template>
<FormSplit> <FormSplit>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.users }}</template> <template #key>{{ i18n.ts.users }}</template>
<template #value>{{ number(stats.originalUsersCount) }}</template> <template #value>{{ number(stats.originalUsersCount) }}</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.notes }}</template> <template #key>{{ i18n.ts.notes }}</template>
<template #value>{{ number(stats.originalNotesCount) }}</template> <template #value>{{ number(stats.originalNotesCount) }}</template>
</MkKeyValue> </MkKeyValue>
</FormSplit> </FormSplit>

View file

@ -7,31 +7,31 @@
<div class="_content"> <div class="_content">
<div class="inputs" style="display: flex;"> <div class="inputs" style="display: flex;">
<MkSelect v-model="state" style="margin: 0; flex: 1;"> <MkSelect v-model="state" style="margin: 0; flex: 1;">
<template #label>{{ $ts.state }}</template> <template #label>{{ i18n.ts.state }}</template>
<option value="all">{{ $ts.all }}</option> <option value="all">{{ i18n.ts.all }}</option>
<option value="unresolved">{{ $ts.unresolved }}</option> <option value="unresolved">{{ i18n.ts.unresolved }}</option>
<option value="resolved">{{ $ts.resolved }}</option> <option value="resolved">{{ i18n.ts.resolved }}</option>
</MkSelect> </MkSelect>
<MkSelect v-model="targetUserOrigin" style="margin: 0; flex: 1;"> <MkSelect v-model="targetUserOrigin" style="margin: 0; flex: 1;">
<template #label>{{ $ts.reporteeOrigin }}</template> <template #label>{{ i18n.ts.reporteeOrigin }}</template>
<option value="combined">{{ $ts.all }}</option> <option value="combined">{{ i18n.ts.all }}</option>
<option value="local">{{ $ts.local }}</option> <option value="local">{{ i18n.ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option> <option value="remote">{{ i18n.ts.remote }}</option>
</MkSelect> </MkSelect>
<MkSelect v-model="reporterOrigin" style="margin: 0; flex: 1;"> <MkSelect v-model="reporterOrigin" style="margin: 0; flex: 1;">
<template #label>{{ $ts.reporterOrigin }}</template> <template #label>{{ i18n.ts.reporterOrigin }}</template>
<option value="combined">{{ $ts.all }}</option> <option value="combined">{{ i18n.ts.all }}</option>
<option value="local">{{ $ts.local }}</option> <option value="local">{{ i18n.ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option> <option value="remote">{{ i18n.ts.remote }}</option>
</MkSelect> </MkSelect>
</div> </div>
<!-- TODO <!-- TODO
<div class="inputs" style="display: flex; padding-top: 1.2em;"> <div class="inputs" style="display: flex; padding-top: 1.2em;">
<MkInput v-model="searchUsername" style="margin: 0; flex: 1;" type="text" :spellcheck="false"> <MkInput v-model="searchUsername" style="margin: 0; flex: 1;" type="text" :spellcheck="false">
<span>{{ $ts.username }}</span> <span>{{ i18n.ts.username }}</span>
</MkInput> </MkInput>
<MkInput v-model="searchHost" style="margin: 0; flex: 1;" type="text" :spellcheck="false" :disabled="pagination.params().origin === 'local'"> <MkInput v-model="searchHost" style="margin: 0; flex: 1;" type="text" :spellcheck="false" :disabled="pagination.params().origin === 'local'">
<span>{{ $ts.host }}</span> <span>{{ i18n.ts.host }}</span>
</MkInput> </MkInput>
</div> </div>
--> -->

View file

@ -3,7 +3,7 @@
<FormSuspense :p="init"> <FormSuspense :p="init">
<div class="_formRoot"> <div class="_formRoot">
<FormRadios v-model="provider" class="_formBlock"> <FormRadios v-model="provider" class="_formBlock">
<option :value="null">{{ $ts.none }} ({{ $ts.notRecommended }})</option> <option :value="null">{{ i18n.ts.none }} ({{ i18n.ts.notRecommended }})</option>
<option value="hcaptcha">hCaptcha</option> <option value="hcaptcha">hCaptcha</option>
<option value="recaptcha">reCAPTCHA</option> <option value="recaptcha">reCAPTCHA</option>
</FormRadios> </FormRadios>
@ -11,33 +11,33 @@
<template v-if="provider === 'hcaptcha'"> <template v-if="provider === 'hcaptcha'">
<FormInput v-model="hcaptchaSiteKey" class="_formBlock"> <FormInput v-model="hcaptchaSiteKey" class="_formBlock">
<template #prefix><i class="fas fa-key"></i></template> <template #prefix><i class="fas fa-key"></i></template>
<template #label>{{ $ts.hcaptchaSiteKey }}</template> <template #label>{{ i18n.ts.hcaptchaSiteKey }}</template>
</FormInput> </FormInput>
<FormInput v-model="hcaptchaSecretKey" class="_formBlock"> <FormInput v-model="hcaptchaSecretKey" class="_formBlock">
<template #prefix><i class="fas fa-key"></i></template> <template #prefix><i class="fas fa-key"></i></template>
<template #label>{{ $ts.hcaptchaSecretKey }}</template> <template #label>{{ i18n.ts.hcaptchaSecretKey }}</template>
</FormInput> </FormInput>
<FormSlot class="_formBlock"> <FormSlot class="_formBlock">
<template #label>{{ $ts.preview }}</template> <template #label>{{ i18n.ts.preview }}</template>
<MkCaptcha provider="hcaptcha" :sitekey="hcaptchaSiteKey || '10000000-ffff-ffff-ffff-000000000001'"/> <MkCaptcha provider="hcaptcha" :sitekey="hcaptchaSiteKey || '10000000-ffff-ffff-ffff-000000000001'"/>
</FormSlot> </FormSlot>
</template> </template>
<template v-else-if="provider === 'recaptcha'"> <template v-else-if="provider === 'recaptcha'">
<FormInput v-model="recaptchaSiteKey" class="_formBlock"> <FormInput v-model="recaptchaSiteKey" class="_formBlock">
<template #prefix><i class="fas fa-key"></i></template> <template #prefix><i class="fas fa-key"></i></template>
<template #label>{{ $ts.recaptchaSiteKey }}</template> <template #label>{{ i18n.ts.recaptchaSiteKey }}</template>
</FormInput> </FormInput>
<FormInput v-model="recaptchaSecretKey" class="_formBlock"> <FormInput v-model="recaptchaSecretKey" class="_formBlock">
<template #prefix><i class="fas fa-key"></i></template> <template #prefix><i class="fas fa-key"></i></template>
<template #label>{{ $ts.recaptchaSecretKey }}</template> <template #label>{{ i18n.ts.recaptchaSecretKey }}</template>
</FormInput> </FormInput>
<FormSlot v-if="recaptchaSiteKey" class="_formBlock"> <FormSlot v-if="recaptchaSiteKey" class="_formBlock">
<template #label>{{ $ts.preview }}</template> <template #label>{{ i18n.ts.preview }}</template>
<MkCaptcha provider="recaptcha" :sitekey="recaptchaSiteKey"/> <MkCaptcha provider="recaptcha" :sitekey="recaptchaSiteKey"/>
</FormSlot> </FormSlot>
</template> </template>
<FormButton primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> <FormButton primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
</div> </div>
</FormSuspense> </FormSuspense>
</div> </div>
@ -52,6 +52,7 @@ import FormSuspense from '@/components/form/suspense.vue';
import FormSlot from '@/components/form/slot.vue'; import FormSlot from '@/components/form/slot.vue';
import * as os from '@/os'; import * as os from '@/os';
import { fetchInstance } from '@/instance'; import { fetchInstance } from '@/instance';
import { i18n } from '@/i18n';
const MkCaptcha = defineAsyncComponent(() => import('@/components/captcha.vue')); const MkCaptcha = defineAsyncComponent(() => import('@/components/captcha.vue'));

View file

@ -1,5 +1,6 @@
<template> <template>
<XModalWindow ref="dialog" <XModalWindow
ref="dialog"
:width="370" :width="370"
:with-ok-button="true" :with-ok-button="true"
@close="$refs.dialog.close()" @close="$refs.dialog.close()"
@ -12,16 +13,16 @@
<div class="yigymqpb _section"> <div class="yigymqpb _section">
<img :src="emoji.url" class="img"/> <img :src="emoji.url" class="img"/>
<MkInput v-model="name" class="_formBlock"> <MkInput v-model="name" class="_formBlock">
<template #label>{{ $ts.name }}</template> <template #label>{{ i18n.ts.name }}</template>
</MkInput> </MkInput>
<MkInput v-model="category" class="_formBlock" :datalist="categories"> <MkInput v-model="category" class="_formBlock" :datalist="categories">
<template #label>{{ $ts.category }}</template> <template #label>{{ i18n.ts.category }}</template>
</MkInput> </MkInput>
<MkInput v-model="aliases" class="_formBlock"> <MkInput v-model="aliases" class="_formBlock">
<template #label>{{ $ts.tags }}</template> <template #label>{{ i18n.ts.tags }}</template>
<template #caption>{{ $ts.setMultipleBySeparatingWithSpace }}</template> <template #caption>{{ i18n.ts.setMultipleBySeparatingWithSpace }}</template>
</MkInput> </MkInput>
<MkButton danger @click="del()"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</MkButton> <MkButton danger @click="del()"><i class="fas fa-trash-alt"></i> {{ i18n.ts.delete }}</MkButton>
</div> </div>
</div> </div>
</XModalWindow> </XModalWindow>
@ -70,7 +71,7 @@ async function update() {
name, name,
category, category,
aliases: aliases.split(' '), aliases: aliases.split(' '),
} },
}); });
dialog.close(); dialog.close();
@ -84,10 +85,10 @@ async function del() {
if (canceled) return; if (canceled) return;
os.api('admin/emoji/delete', { os.api('admin/emoji/delete', {
id: props.emoji.id id: props.emoji.id,
}).then(() => { }).then(() => {
emit('done', { emit('done', {
deleted: true deleted: true,
}); });
dialog.close(); dialog.close();
}); });

View file

@ -7,7 +7,7 @@
<div v-if="tab === 'local'" class="local"> <div v-if="tab === 'local'" class="local">
<MkInput v-model="query" :debounce="true" type="search"> <MkInput v-model="query" :debounce="true" type="search">
<template #prefix><i class="fas fa-search"></i></template> <template #prefix><i class="fas fa-search"></i></template>
<template #label>{{ $ts.search }}</template> <template #label>{{ i18n.ts.search }}</template>
</MkInput> </MkInput>
<MkSwitch v-model="selectMode" style="margin: 8px 0;"> <MkSwitch v-model="selectMode" style="margin: 8px 0;">
<template #label>Select mode</template> <template #label>Select mode</template>
@ -21,7 +21,7 @@
<MkButton inline danger @click="delBulk">Delete</MkButton> <MkButton inline danger @click="delBulk">Delete</MkButton>
</div> </div>
<MkPagination ref="emojisPaginationComponent" :pagination="pagination"> <MkPagination ref="emojisPaginationComponent" :pagination="pagination">
<template #empty><span>{{ $ts.noCustomEmojis }}</span></template> <template #empty><span>{{ i18n.ts.noCustomEmojis }}</span></template>
<template #default="{items}"> <template #default="{items}">
<div class="ldhfsamy"> <div class="ldhfsamy">
<button v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" :class="{ selected: selectedEmojis.includes(emoji.id) }" @click="selectMode ? toggleSelect(emoji) : edit(emoji)"> <button v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" :class="{ selected: selectedEmojis.includes(emoji.id) }" @click="selectMode ? toggleSelect(emoji) : edit(emoji)">
@ -40,14 +40,14 @@
<FormSplit> <FormSplit>
<MkInput v-model="queryRemote" :debounce="true" type="search"> <MkInput v-model="queryRemote" :debounce="true" type="search">
<template #prefix><i class="fas fa-search"></i></template> <template #prefix><i class="fas fa-search"></i></template>
<template #label>{{ $ts.search }}</template> <template #label>{{ i18n.ts.search }}</template>
</MkInput> </MkInput>
<MkInput v-model="host" :debounce="true"> <MkInput v-model="host" :debounce="true">
<template #label>{{ $ts.host }}</template> <template #label>{{ i18n.ts.host }}</template>
</MkInput> </MkInput>
</FormSplit> </FormSplit>
<MkPagination :pagination="remotePagination"> <MkPagination :pagination="remotePagination">
<template #empty><span>{{ $ts.noCustomEmojis }}</span></template> <template #empty><span>{{ i18n.ts.noCustomEmojis }}</span></template>
<template #default="{items}"> <template #default="{items}">
<div class="ldhfsamy"> <div class="ldhfsamy">
<div v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" @click="remoteMenu(emoji, $event)"> <div v-for="emoji in items" :key="emoji.id" class="emoji _panel _button" @click="remoteMenu(emoji, $event)">

View file

@ -7,13 +7,13 @@
<div> <div>
<div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap;"> <div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap;">
<MkSelect v-model="origin" style="margin: 0; flex: 1;"> <MkSelect v-model="origin" style="margin: 0; flex: 1;">
<template #label>{{ $ts.instance }}</template> <template #label>{{ i18n.ts.instance }}</template>
<option value="combined">{{ $ts.all }}</option> <option value="combined">{{ i18n.ts.all }}</option>
<option value="local">{{ $ts.local }}</option> <option value="local">{{ i18n.ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option> <option value="remote">{{ i18n.ts.remote }}</option>
</MkSelect> </MkSelect>
<MkInput v-model="searchHost" :debounce="true" type="search" style="margin: 0; flex: 1;" :disabled="pagination.params.origin === 'local'"> <MkInput v-model="searchHost" :debounce="true" type="search" style="margin: 0; flex: 1;" :disabled="pagination.params.origin === 'local'">
<template #label>{{ $ts.host }}</template> <template #label>{{ i18n.ts.host }}</template>
</MkInput> </MkInput>
</div> </div>
<div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap; padding-top: 1.2em;"> <div class="inputs" style="display: flex; gap: var(--margin); flex-wrap: wrap; padding-top: 1.2em;">

View file

@ -1,23 +1,23 @@
<template> <template>
<div ref="el" class="hiyeyicy" :class="{ wide: !narrow }"> <div ref="el" class="hiyeyicy" :class="{ wide: !narrow }">
<div v-if="!narrow || initialPage == null" class="nav"> <div v-if="!narrow || currentPage?.route.name == null" class="nav">
<MkSpacer :content-max="700" :margin-min="16"> <MkSpacer :content-max="700" :margin-min="16">
<div class="lxpfedzu"> <div class="lxpfedzu">
<div class="banner"> <div class="banner">
<img :src="$instance.iconUrl || '/favicon.ico'" alt="" class="icon"/> <img :src="$instance.iconUrl || '/favicon.ico'" alt="" class="icon"/>
</div> </div>
<MkInfo v-if="thereIsUnresolvedAbuseReport" warn class="info">{{ $ts.thereIsUnresolvedAbuseReportWarning }} <MkA to="/admin/abuses" class="_link">{{ $ts.check }}</MkA></MkInfo> <MkInfo v-if="thereIsUnresolvedAbuseReport" warn class="info">{{ i18n.ts.thereIsUnresolvedAbuseReportWarning }} <MkA to="/admin/abuses" class="_link">{{ i18n.ts.check }}</MkA></MkInfo>
<MkInfo v-if="noMaintainerInformation" warn class="info">{{ $ts.noMaintainerInformationWarning }} <MkA to="/admin/settings" class="_link">{{ $ts.configure }}</MkA></MkInfo> <MkInfo v-if="noMaintainerInformation" warn class="info">{{ i18n.ts.noMaintainerInformationWarning }} <MkA to="/admin/settings" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
<MkInfo v-if="noBotProtection" warn class="info">{{ $ts.noBotProtectionWarning }} <MkA to="/admin/security" class="_link">{{ $ts.configure }}</MkA></MkInfo> <MkInfo v-if="noBotProtection" warn class="info">{{ i18n.ts.noBotProtectionWarning }} <MkA to="/admin/security" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
<MkInfo v-if="noEmailServer" warn class="info">{{ $ts.noEmailServerWarning }} <MkA to="/admin/email-settings" class="_link">{{ $ts.configure }}</MkA></MkInfo> <MkInfo v-if="noEmailServer" warn class="info">{{ i18n.ts.noEmailServerWarning }} <MkA to="/admin/email-settings" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
<MkSuperMenu :def="menuDef" :grid="initialPage == null"></MkSuperMenu> <MkSuperMenu :def="menuDef" :grid="currentPage?.route.name == null"></MkSuperMenu>
</div> </div>
</MkSpacer> </MkSpacer>
</div> </div>
<div v-if="!(narrow && initialPage == null)" class="main"> <div v-if="!(narrow && currentPage?.route.name == null)" class="main">
<component :is="component" :key="initialPage" v-bind="pageProps"/> <RouterView/>
</div> </div>
</div> </div>
</template> </template>
@ -44,15 +44,10 @@ const indexInfo = {
hideHeader: true, hideHeader: true,
}; };
const props = defineProps<{
initialPage?: string,
}>();
provide('shouldOmitHeaderTitle', false); provide('shouldOmitHeaderTitle', false);
let INFO = $ref(indexInfo); let INFO = $ref(indexInfo);
let childInfo = $ref(null); let childInfo = $ref(null);
let page = $ref(props.initialPage);
let narrow = $ref(false); let narrow = $ref(false);
let view = $ref(null); let view = $ref(null);
let el = $ref(null); let el = $ref(null);
@ -61,6 +56,7 @@ let noMaintainerInformation = isEmpty(instance.maintainerName) || isEmpty(instan
let noBotProtection = !instance.disableRegistration && !instance.enableHcaptcha && !instance.enableRecaptcha; let noBotProtection = !instance.disableRegistration && !instance.enableHcaptcha && !instance.enableRecaptcha;
let noEmailServer = !instance.enableEmail; let noEmailServer = !instance.enableEmail;
let thereIsUnresolvedAbuseReport = $ref(false); let thereIsUnresolvedAbuseReport = $ref(false);
let currentPage = $computed(() => router.currentRef.value.child);
os.api('admin/abuse-user-reports', { os.api('admin/abuse-user-reports', {
state: 'unresolved', state: 'unresolved',
@ -94,47 +90,47 @@ const menuDef = $computed(() => [{
icon: 'fas fa-tachometer-alt', icon: 'fas fa-tachometer-alt',
text: i18n.ts.dashboard, text: i18n.ts.dashboard,
to: '/admin/overview', to: '/admin/overview',
active: props.initialPage === 'overview', active: currentPage?.route.name === 'overview',
}, { }, {
icon: 'fas fa-users', icon: 'fas fa-users',
text: i18n.ts.users, text: i18n.ts.users,
to: '/admin/users', to: '/admin/users',
active: props.initialPage === 'users', active: currentPage?.route.name === 'users',
}, { }, {
icon: 'fas fa-laugh', icon: 'fas fa-laugh',
text: i18n.ts.customEmojis, text: i18n.ts.customEmojis,
to: '/admin/emojis', to: '/admin/emojis',
active: props.initialPage === 'emojis', active: currentPage?.route.name === 'emojis',
}, { }, {
icon: 'fas fa-globe', icon: 'fas fa-globe',
text: i18n.ts.federation, text: i18n.ts.federation,
to: '/about#federation', to: '/about#federation',
active: props.initialPage === 'federation', active: currentPage?.route.name === 'federation',
}, { }, {
icon: 'fas fa-clipboard-list', icon: 'fas fa-clipboard-list',
text: i18n.ts.jobQueue, text: i18n.ts.jobQueue,
to: '/admin/queue', to: '/admin/queue',
active: props.initialPage === 'queue', active: currentPage?.route.name === 'queue',
}, { }, {
icon: 'fas fa-cloud', icon: 'fas fa-cloud',
text: i18n.ts.files, text: i18n.ts.files,
to: '/admin/files', to: '/admin/files',
active: props.initialPage === 'files', active: currentPage?.route.name === 'files',
}, { }, {
icon: 'fas fa-broadcast-tower', icon: 'fas fa-broadcast-tower',
text: i18n.ts.announcements, text: i18n.ts.announcements,
to: '/admin/announcements', to: '/admin/announcements',
active: props.initialPage === 'announcements', active: currentPage?.route.name === 'announcements',
}, { }, {
icon: 'fas fa-audio-description', icon: 'fas fa-audio-description',
text: i18n.ts.ads, text: i18n.ts.ads,
to: '/admin/ads', to: '/admin/ads',
active: props.initialPage === 'ads', active: currentPage?.route.name === 'ads',
}, { }, {
icon: 'fas fa-exclamation-circle', icon: 'fas fa-exclamation-circle',
text: i18n.ts.abuseReports, text: i18n.ts.abuseReports,
to: '/admin/abuses', to: '/admin/abuses',
active: props.initialPage === 'abuses', active: currentPage?.route.name === 'abuses',
}], }],
}, { }, {
title: i18n.ts.settings, title: i18n.ts.settings,
@ -142,47 +138,47 @@ const menuDef = $computed(() => [{
icon: 'fas fa-cog', icon: 'fas fa-cog',
text: i18n.ts.general, text: i18n.ts.general,
to: '/admin/settings', to: '/admin/settings',
active: props.initialPage === 'settings', active: currentPage?.route.name === 'settings',
}, { }, {
icon: 'fas fa-envelope', icon: 'fas fa-envelope',
text: i18n.ts.emailServer, text: i18n.ts.emailServer,
to: '/admin/email-settings', to: '/admin/email-settings',
active: props.initialPage === 'email-settings', active: currentPage?.route.name === 'email-settings',
}, { }, {
icon: 'fas fa-cloud', icon: 'fas fa-cloud',
text: i18n.ts.objectStorage, text: i18n.ts.objectStorage,
to: '/admin/object-storage', to: '/admin/object-storage',
active: props.initialPage === 'object-storage', active: currentPage?.route.name === 'object-storage',
}, { }, {
icon: 'fas fa-lock', icon: 'fas fa-lock',
text: i18n.ts.security, text: i18n.ts.security,
to: '/admin/security', to: '/admin/security',
active: props.initialPage === 'security', active: currentPage?.route.name === 'security',
}, { }, {
icon: 'fas fa-globe', icon: 'fas fa-globe',
text: i18n.ts.relays, text: i18n.ts.relays,
to: '/admin/relays', to: '/admin/relays',
active: props.initialPage === 'relays', active: currentPage?.route.name === 'relays',
}, { }, {
icon: 'fas fa-share-alt', icon: 'fas fa-share-alt',
text: i18n.ts.integration, text: i18n.ts.integration,
to: '/admin/integrations', to: '/admin/integrations',
active: props.initialPage === 'integrations', active: currentPage?.route.name === 'integrations',
}, { }, {
icon: 'fas fa-ban', icon: 'fas fa-ban',
text: i18n.ts.instanceBlocking, text: i18n.ts.instanceBlocking,
to: '/admin/instance-block', to: '/admin/instance-block',
active: props.initialPage === 'instance-block', active: currentPage?.route.name === 'instance-block',
}, { }, {
icon: 'fas fa-ghost', icon: 'fas fa-ghost',
text: i18n.ts.proxyAccount, text: i18n.ts.proxyAccount,
to: '/admin/proxy-account', to: '/admin/proxy-account',
active: props.initialPage === 'proxy-account', active: currentPage?.route.name === 'proxy-account',
}, { }, {
icon: 'fas fa-cogs', icon: 'fas fa-cogs',
text: i18n.ts.other, text: i18n.ts.other,
to: '/admin/other-settings', to: '/admin/other-settings',
active: props.initialPage === 'other-settings', active: currentPage?.route.name === 'other-settings',
}], }],
}, { }, {
title: i18n.ts.info, title: i18n.ts.info,
@ -190,55 +186,12 @@ const menuDef = $computed(() => [{
icon: 'fas fa-database', icon: 'fas fa-database',
text: i18n.ts.database, text: i18n.ts.database,
to: '/admin/database', to: '/admin/database',
active: props.initialPage === 'database', active: currentPage?.route.name === 'database',
}], }],
}]); }]);
const component = $computed(() => {
if (props.initialPage == null) return null;
switch (props.initialPage) {
case 'overview': return defineAsyncComponent(() => import('./overview.vue'));
case 'users': return defineAsyncComponent(() => import('./users.vue'));
case 'emojis': return defineAsyncComponent(() => import('./emojis.vue'));
//case 'federation': return defineAsyncComponent(() => import('../federation.vue'));
case 'queue': return defineAsyncComponent(() => import('./queue.vue'));
case 'files': return defineAsyncComponent(() => import('./files.vue'));
case 'announcements': return defineAsyncComponent(() => import('./announcements.vue'));
case 'ads': return defineAsyncComponent(() => import('./ads.vue'));
case 'database': return defineAsyncComponent(() => import('./database.vue'));
case 'abuses': return defineAsyncComponent(() => import('./abuses.vue'));
case 'settings': return defineAsyncComponent(() => import('./settings.vue'));
case 'email-settings': return defineAsyncComponent(() => import('./email-settings.vue'));
case 'object-storage': return defineAsyncComponent(() => import('./object-storage.vue'));
case 'security': return defineAsyncComponent(() => import('./security.vue'));
case 'relays': return defineAsyncComponent(() => import('./relays.vue'));
case 'integrations': return defineAsyncComponent(() => import('./integrations.vue'));
case 'instance-block': return defineAsyncComponent(() => import('./instance-block.vue'));
case 'proxy-account': return defineAsyncComponent(() => import('./proxy-account.vue'));
case 'other-settings': return defineAsyncComponent(() => import('./other-settings.vue'));
}
});
watch(component, () => {
pageProps = {};
nextTick(() => {
scroll(el, { top: 0 });
});
}, { immediate: true });
watch(() => props.initialPage, () => {
if (props.initialPage == null && !narrow) {
router.push('/admin/overview');
} else {
if (props.initialPage == null) {
INFO = indexInfo;
}
}
});
watch(narrow, () => { watch(narrow, () => {
if (props.initialPage == null && !narrow) { if (currentPage?.route.name == null && !narrow) {
router.push('/admin/overview'); router.push('/admin/overview');
} }
}); });
@ -247,7 +200,7 @@ onMounted(() => {
ro.observe(el); ro.observe(el);
narrow = el.offsetWidth < NARROW_THRESHOLD; narrow = el.offsetWidth < NARROW_THRESHOLD;
if (props.initialPage == null && !narrow) { if (currentPage?.route.name == null && !narrow) {
router.push('/admin/overview'); router.push('/admin/overview');
} }
}); });

View file

@ -2,7 +2,7 @@
<FormSuspense :p="init"> <FormSuspense :p="init">
<div class="_formRoot"> <div class="_formRoot">
<FormSwitch v-model="enableDiscordIntegration" class="_formBlock"> <FormSwitch v-model="enableDiscordIntegration" class="_formBlock">
<template #label>{{ $ts.enable }}</template> <template #label>{{ i18n.ts.enable }}</template>
</FormSwitch> </FormSwitch>
<template v-if="enableDiscordIntegration"> <template v-if="enableDiscordIntegration">
@ -19,7 +19,7 @@
</FormInput> </FormInput>
</template> </template>
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> <FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
</div> </div>
</FormSuspense> </FormSuspense>
</template> </template>
@ -33,6 +33,7 @@ import FormInfo from '@/components/ui/info.vue';
import FormSuspense from '@/components/form/suspense.vue'; import FormSuspense from '@/components/form/suspense.vue';
import * as os from '@/os'; import * as os from '@/os';
import { fetchInstance } from '@/instance'; import { fetchInstance } from '@/instance';
import { i18n } from '@/i18n';
let uri: string = $ref(''); let uri: string = $ref('');
let enableDiscordIntegration: boolean = $ref(false); let enableDiscordIntegration: boolean = $ref(false);

View file

@ -2,7 +2,7 @@
<FormSuspense :p="init"> <FormSuspense :p="init">
<div class="_formRoot"> <div class="_formRoot">
<FormSwitch v-model="enableGithubIntegration" class="_formBlock"> <FormSwitch v-model="enableGithubIntegration" class="_formBlock">
<template #label>{{ $ts.enable }}</template> <template #label>{{ i18n.ts.enable }}</template>
</FormSwitch> </FormSwitch>
<template v-if="enableGithubIntegration"> <template v-if="enableGithubIntegration">
@ -19,7 +19,7 @@
</FormInput> </FormInput>
</template> </template>
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> <FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
</div> </div>
</FormSuspense> </FormSuspense>
</template> </template>
@ -33,6 +33,7 @@ import FormInfo from '@/components/ui/info.vue';
import FormSuspense from '@/components/form/suspense.vue'; import FormSuspense from '@/components/form/suspense.vue';
import * as os from '@/os'; import * as os from '@/os';
import { fetchInstance } from '@/instance'; import { fetchInstance } from '@/instance';
import { i18n } from '@/i18n';
let uri: string = $ref(''); let uri: string = $ref('');
let enableGithubIntegration: boolean = $ref(false); let enableGithubIntegration: boolean = $ref(false);

View file

@ -2,7 +2,7 @@
<FormSuspense :p="init"> <FormSuspense :p="init">
<div class="_formRoot"> <div class="_formRoot">
<FormSwitch v-model="enableTwitterIntegration" class="_formBlock"> <FormSwitch v-model="enableTwitterIntegration" class="_formBlock">
<template #label>{{ $ts.enable }}</template> <template #label>{{ i18n.ts.enable }}</template>
</FormSwitch> </FormSwitch>
<template v-if="enableTwitterIntegration"> <template v-if="enableTwitterIntegration">
@ -19,7 +19,7 @@
</FormInput> </FormInput>
</template> </template>
<FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> <FormButton primary class="_formBlock" @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
</div> </div>
</FormSuspense> </FormSuspense>
</template> </template>
@ -33,6 +33,7 @@ import FormInfo from '@/components/ui/info.vue';
import FormSuspense from '@/components/form/suspense.vue'; import FormSuspense from '@/components/form/suspense.vue';
import * as os from '@/os'; import * as os from '@/os';
import { fetchInstance } from '@/instance'; import { fetchInstance } from '@/instance';
import { i18n } from '@/i18n';
let uri: string = $ref(''); let uri: string = $ref('');
let enableTwitterIntegration: boolean = $ref(false); let enableTwitterIntegration: boolean = $ref(false);

View file

@ -33,7 +33,7 @@
<span style="margin-left: 8px; opacity: 0.7;">({{ number(job[1]) }} jobs)</span> <span style="margin-left: 8px; opacity: 0.7;">({{ number(job[1]) }} jobs)</span>
</div> </div>
</div> </div>
<span v-else style="opacity: 0.5;">{{ $ts.noJobs }}</span> <span v-else style="opacity: 0.5;">{{ i18n.ts.noJobs }}</span>
</div> </div>
</div> </div>
</template> </template>
@ -44,6 +44,7 @@ import XChart from './queue.chart.chart.vue';
import number from '@/filters/number'; import number from '@/filters/number';
import * as os from '@/os'; import * as os from '@/os';
import { stream } from '@/stream'; import { stream } from '@/stream';
import { i18n } from '@/i18n';
const connection = markRaw(stream.useChannel('queueStats')); const connection = markRaw(stream.useChannel('queueStats'));

View file

@ -7,36 +7,36 @@
<div class="users"> <div class="users">
<div class="inputs"> <div class="inputs">
<MkSelect v-model="sort" style="flex: 1;"> <MkSelect v-model="sort" style="flex: 1;">
<template #label>{{ $ts.sort }}</template> <template #label>{{ i18n.ts.sort }}</template>
<option value="-createdAt">{{ $ts.registeredDate }} ({{ $ts.ascendingOrder }})</option> <option value="-createdAt">{{ i18n.ts.registeredDate }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+createdAt">{{ $ts.registeredDate }} ({{ $ts.descendingOrder }})</option> <option value="+createdAt">{{ i18n.ts.registeredDate }} ({{ i18n.ts.descendingOrder }})</option>
<option value="-updatedAt">{{ $ts.lastUsed }} ({{ $ts.ascendingOrder }})</option> <option value="-updatedAt">{{ i18n.ts.lastUsed }} ({{ i18n.ts.ascendingOrder }})</option>
<option value="+updatedAt">{{ $ts.lastUsed }} ({{ $ts.descendingOrder }})</option> <option value="+updatedAt">{{ i18n.ts.lastUsed }} ({{ i18n.ts.descendingOrder }})</option>
</MkSelect> </MkSelect>
<MkSelect v-model="state" style="flex: 1;"> <MkSelect v-model="state" style="flex: 1;">
<template #label>{{ $ts.state }}</template> <template #label>{{ i18n.ts.state }}</template>
<option value="all">{{ $ts.all }}</option> <option value="all">{{ i18n.ts.all }}</option>
<option value="available">{{ $ts.normal }}</option> <option value="available">{{ i18n.ts.normal }}</option>
<option value="admin">{{ $ts.administrator }}</option> <option value="admin">{{ i18n.ts.administrator }}</option>
<option value="moderator">{{ $ts.moderator }}</option> <option value="moderator">{{ i18n.ts.moderator }}</option>
<option value="silenced">{{ $ts.silence }}</option> <option value="silenced">{{ i18n.ts.silence }}</option>
<option value="suspended">{{ $ts.suspend }}</option> <option value="suspended">{{ i18n.ts.suspend }}</option>
</MkSelect> </MkSelect>
<MkSelect v-model="origin" style="flex: 1;"> <MkSelect v-model="origin" style="flex: 1;">
<template #label>{{ $ts.instance }}</template> <template #label>{{ i18n.ts.instance }}</template>
<option value="combined">{{ $ts.all }}</option> <option value="combined">{{ i18n.ts.all }}</option>
<option value="local">{{ $ts.local }}</option> <option value="local">{{ i18n.ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option> <option value="remote">{{ i18n.ts.remote }}</option>
</MkSelect> </MkSelect>
</div> </div>
<div class="inputs"> <div class="inputs">
<MkInput v-model="searchUsername" style="flex: 1;" type="text" :spellcheck="false" @update:modelValue="$refs.users.reload()"> <MkInput v-model="searchUsername" style="flex: 1;" type="text" :spellcheck="false" @update:modelValue="$refs.users.reload()">
<template #prefix>@</template> <template #prefix>@</template>
<template #label>{{ $ts.username }}</template> <template #label>{{ i18n.ts.username }}</template>
</MkInput> </MkInput>
<MkInput v-model="searchHost" style="flex: 1;" type="text" :spellcheck="false" :disabled="pagination.params.origin === 'local'" @update:modelValue="$refs.users.reload()"> <MkInput v-model="searchHost" style="flex: 1;" type="text" :spellcheck="false" :disabled="pagination.params.origin === 'local'" @update:modelValue="$refs.users.reload()">
<template #prefix>@</template> <template #prefix>@</template>
<template #label>{{ $ts.host }}</template> <template #label>{{ i18n.ts.host }}</template>
</MkInput> </MkInput>
</div> </div>

View file

@ -4,22 +4,22 @@
<MkSpacer :content-max="700"> <MkSpacer :content-max="700">
<div class="_formRoot"> <div class="_formRoot">
<MkInput v-model="name" class="_formBlock"> <MkInput v-model="name" class="_formBlock">
<template #label>{{ $ts.name }}</template> <template #label>{{ i18n.ts.name }}</template>
</MkInput> </MkInput>
<MkTextarea v-model="description" class="_formBlock"> <MkTextarea v-model="description" class="_formBlock">
<template #label>{{ $ts.description }}</template> <template #label>{{ i18n.ts.description }}</template>
</MkTextarea> </MkTextarea>
<div class="banner"> <div class="banner">
<MkButton v-if="bannerId == null" @click="setBannerImage"><i class="fas fa-plus"></i> {{ $ts._channel.setBanner }}</MkButton> <MkButton v-if="bannerId == null" @click="setBannerImage"><i class="fas fa-plus"></i> {{ i18n.ts._channel.setBanner }}</MkButton>
<div v-else-if="bannerUrl"> <div v-else-if="bannerUrl">
<img :src="bannerUrl" style="width: 100%;"/> <img :src="bannerUrl" style="width: 100%;"/>
<MkButton @click="removeBannerImage()"><i class="fas fa-trash-alt"></i> {{ $ts._channel.removeBanner }}</MkButton> <MkButton @click="removeBannerImage()"><i class="fas fa-trash-alt"></i> {{ i18n.ts._channel.removeBanner }}</MkButton>
</div> </div>
</div> </div>
<div class="_formBlock"> <div class="_formBlock">
<MkButton primary @click="save()"><i class="fas fa-save"></i> {{ channelId ? $ts.save : $ts.create }}</MkButton> <MkButton primary @click="save()"><i class="fas fa-save"></i> {{ channelId ? i18n.ts.save : i18n.ts.create }}</MkButton>
</div> </div>
</div> </div>
</MkSpacer> </MkSpacer>

View file

@ -13,8 +13,8 @@
</div> </div>
<div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : null }" class="banner"> <div :style="{ backgroundImage: channel.bannerUrl ? `url(${channel.bannerUrl})` : null }" class="banner">
<div class="status"> <div class="status">
<div><i class="fas fa-users fa-fw"></i><I18n :src="$ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div> <div><i class="fas fa-users fa-fw"></i><I18n :src="i18n.ts._channel.usersCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.usersCount }}</b></template></I18n></div>
<div><i class="fas fa-pencil-alt fa-fw"></i><I18n :src="$ts._channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></I18n></div> <div><i class="fas fa-pencil-alt fa-fw"></i><I18n :src="i18n.ts._channel.notesCount" tag="span" style="margin-left: 4px;"><template #n><b>{{ channel.notesCount }}</b></template></I18n></div>
</div> </div>
<div class="fade"></div> <div class="fade"></div>
</div> </div>

View file

@ -1,32 +1,32 @@
<template> <template>
<MkSpacer :content-max="1200"> <MkSpacer :content-max="1200">
<MkTab v-model="origin" style="margin-bottom: var(--margin);"> <MkTab v-model="origin" style="margin-bottom: var(--margin);">
<option value="local">{{ $ts.local }}</option> <option value="local">{{ i18n.ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option> <option value="remote">{{ i18n.ts.remote }}</option>
</MkTab> </MkTab>
<div v-if="origin === 'local'"> <div v-if="origin === 'local'">
<template v-if="tag == null"> <template v-if="tag == null">
<MkFolder class="_gap" persist-key="explore-pinned-users"> <MkFolder class="_gap" persist-key="explore-pinned-users">
<template #header><i class="fas fa-bookmark fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.pinnedUsers }}</template> <template #header><i class="fas fa-bookmark fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.pinnedUsers }}</template>
<XUserList :pagination="pinnedUsers"/> <XUserList :pagination="pinnedUsers"/>
</MkFolder> </MkFolder>
<MkFolder class="_gap" persist-key="explore-popular-users"> <MkFolder class="_gap" persist-key="explore-popular-users">
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularUsers }}</template> <template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
<XUserList :pagination="popularUsers"/> <XUserList :pagination="popularUsers"/>
</MkFolder> </MkFolder>
<MkFolder class="_gap" persist-key="explore-recently-updated-users"> <MkFolder class="_gap" persist-key="explore-recently-updated-users">
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyUpdatedUsers }}</template> <template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
<XUserList :pagination="recentlyUpdatedUsers"/> <XUserList :pagination="recentlyUpdatedUsers"/>
</MkFolder> </MkFolder>
<MkFolder class="_gap" persist-key="explore-recently-registered-users"> <MkFolder class="_gap" persist-key="explore-recently-registered-users">
<template #header><i class="fas fa-plus fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyRegisteredUsers }}</template> <template #header><i class="fas fa-plus fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyRegisteredUsers }}</template>
<XUserList :pagination="recentlyRegisteredUsers"/> <XUserList :pagination="recentlyRegisteredUsers"/>
</MkFolder> </MkFolder>
</template> </template>
</div> </div>
<div v-else> <div v-else>
<MkFolder ref="tagsEl" :foldable="true" :expanded="false" class="_gap"> <MkFolder ref="tagsEl" :foldable="true" :expanded="false" class="_gap">
<template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularTags }}</template> <template #header><i class="fas fa-hashtag fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularTags }}</template>
<div class="vxjfqztj"> <div class="vxjfqztj">
<MkA v-for="tag in tagsLocal" :key="'local:' + tag.tag" :to="`/explore/tags/${tag.tag}`" class="local">{{ tag.tag }}</MkA> <MkA v-for="tag in tagsLocal" :key="'local:' + tag.tag" :to="`/explore/tags/${tag.tag}`" class="local">{{ tag.tag }}</MkA>
@ -41,15 +41,15 @@
<template v-if="tag == null"> <template v-if="tag == null">
<MkFolder class="_gap"> <MkFolder class="_gap">
<template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.popularUsers }}</template> <template #header><i class="fas fa-chart-line fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.popularUsers }}</template>
<XUserList :pagination="popularUsersF"/> <XUserList :pagination="popularUsersF"/>
</MkFolder> </MkFolder>
<MkFolder class="_gap"> <MkFolder class="_gap">
<template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyUpdatedUsers }}</template> <template #header><i class="fas fa-comment-alt fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyUpdatedUsers }}</template>
<XUserList :pagination="recentlyUpdatedUsersF"/> <XUserList :pagination="recentlyUpdatedUsersF"/>
</MkFolder> </MkFolder>
<MkFolder class="_gap"> <MkFolder class="_gap">
<template #header><i class="fas fa-rocket fa-fw" style="margin-right: 0.5em;"></i>{{ $ts.recentlyDiscoveredUsers }}</template> <template #header><i class="fas fa-rocket fa-fw" style="margin-right: 0.5em;"></i>{{ i18n.ts.recentlyDiscoveredUsers }}</template>
<XUserList :pagination="recentlyRegisteredUsersF"/> <XUserList :pagination="recentlyRegisteredUsersF"/>
</MkFolder> </MkFolder>
</template> </template>

View file

@ -13,12 +13,12 @@
<div> <div>
<MkInput v-model="searchQuery" :debounce="true" type="search" class="_formBlock"> <MkInput v-model="searchQuery" :debounce="true" type="search" class="_formBlock">
<template #prefix><i class="fas fa-search"></i></template> <template #prefix><i class="fas fa-search"></i></template>
<template #label>{{ $ts.searchUser }}</template> <template #label>{{ i18n.ts.searchUser }}</template>
</MkInput> </MkInput>
<MkRadios v-model="searchOrigin" class="_formBlock"> <MkRadios v-model="searchOrigin" class="_formBlock">
<option value="combined">{{ $ts.all }}</option> <option value="combined">{{ i18n.ts.all }}</option>
<option value="local">{{ $ts.local }}</option> <option value="local">{{ i18n.ts.local }}</option>
<option value="remote">{{ $ts.remote }}</option> <option value="remote">{{ i18n.ts.remote }}</option>
</MkRadios> </MkRadios>
</div> </div>

View file

@ -6,7 +6,7 @@
<template #empty> <template #empty>
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/> <img src="/static-assets/badges/info.jpg" class="_ghost" alt="Info"/>
<div>{{ $ts.noNotes }}</div> <div>{{ i18n.ts.noNotes }}</div>
</div> </div>
</template> </template>

View file

@ -6,7 +6,7 @@
<template #empty> <template #empty>
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/info.jpg" class="_ghost"/> <img src="/static-assets/badges/info.jpg" class="_ghost"/>
<div>{{ $ts.noFollowRequests }}</div> <div>{{ i18n.ts.noFollowRequests }}</div>
</div> </div>
</template> </template>
<template #default="{items}"> <template #default="{items}">

View file

@ -4,27 +4,27 @@
<MkSpacer :content-max="800" :margin-min="16" :margin-max="32"> <MkSpacer :content-max="800" :margin-min="16" :margin-max="32">
<FormSuspense :p="init"> <FormSuspense :p="init">
<FormInput v-model="title"> <FormInput v-model="title">
<template #label>{{ $ts.title }}</template> <template #label>{{ i18n.ts.title }}</template>
</FormInput> </FormInput>
<FormTextarea v-model="description" :max="500"> <FormTextarea v-model="description" :max="500">
<template #label>{{ $ts.description }}</template> <template #label>{{ i18n.ts.description }}</template>
</FormTextarea> </FormTextarea>
<div class=""> <div class="">
<div v-for="file in files" :key="file.id" class="wqugxsfx" :style="{ backgroundImage: file ? `url(${ file.thumbnailUrl })` : null }"> <div v-for="file in files" :key="file.id" class="wqugxsfx" :style="{ backgroundImage: file ? `url(${ file.thumbnailUrl })` : null }">
<div class="name">{{ file.name }}</div> <div class="name">{{ file.name }}</div>
<button v-tooltip="$ts.remove" class="remove _button" @click="remove(file)"><i class="fas fa-times"></i></button> <button v-tooltip="i18n.ts.remove" class="remove _button" @click="remove(file)"><i class="fas fa-times"></i></button>
</div> </div>
<FormButton primary @click="selectFile"><i class="fas fa-plus"></i> {{ $ts.attachFile }}</FormButton> <FormButton primary @click="selectFile"><i class="fas fa-plus"></i> {{ i18n.ts.attachFile }}</FormButton>
</div> </div>
<FormSwitch v-model="isSensitive">{{ $ts.markAsSensitive }}</FormSwitch> <FormSwitch v-model="isSensitive">{{ i18n.ts.markAsSensitive }}</FormSwitch>
<FormButton v-if="postId" primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</FormButton> <FormButton v-if="postId" primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</FormButton>
<FormButton v-else primary @click="save"><i class="fas fa-save"></i> {{ $ts.publish }}</FormButton> <FormButton v-else primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.publish }}</FormButton>
<FormButton v-if="postId" danger @click="del"><i class="fas fa-trash-alt"></i> {{ $ts.delete }}</FormButton> <FormButton v-if="postId" danger @click="del"><i class="fas fa-trash-alt"></i> {{ i18n.ts.delete }}</FormButton>
</FormSuspense> </FormSuspense>
</MkSpacer> </MkSpacer>
</MkStickyContainer> </MkStickyContainer>

View file

@ -5,7 +5,7 @@
<div class="_root"> <div class="_root">
<div v-if="tab === 'explore'"> <div v-if="tab === 'explore'">
<MkFolder class="_gap"> <MkFolder class="_gap">
<template #header><i class="fas fa-clock"></i>{{ $ts.recentPosts }}</template> <template #header><i class="fas fa-clock"></i>{{ i18n.ts.recentPosts }}</template>
<MkPagination v-slot="{items}" :pagination="recentPostsPagination" :disable-auto-load="true"> <MkPagination v-slot="{items}" :pagination="recentPostsPagination" :disable-auto-load="true">
<div class="vfpdbgtk"> <div class="vfpdbgtk">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/> <MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
@ -13,7 +13,7 @@
</MkPagination> </MkPagination>
</MkFolder> </MkFolder>
<MkFolder class="_gap"> <MkFolder class="_gap">
<template #header><i class="fas fa-fire-alt"></i>{{ $ts.popularPosts }}</template> <template #header><i class="fas fa-fire-alt"></i>{{ i18n.ts.popularPosts }}</template>
<MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true"> <MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true">
<div class="vfpdbgtk"> <div class="vfpdbgtk">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/> <MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
@ -29,7 +29,7 @@
</MkPagination> </MkPagination>
</div> </div>
<div v-else-if="tab === 'my'"> <div v-else-if="tab === 'my'">
<MkA to="/gallery/new" class="_link" style="margin: 16px;"><i class="fas fa-plus"></i> {{ $ts.postToGallery }}</MkA> <MkA to="/gallery/new" class="_link" style="margin: 16px;"><i class="fas fa-plus"></i> {{ i18n.ts.postToGallery }}</MkA>
<MkPagination v-slot="{items}" :pagination="myPostsPagination"> <MkPagination v-slot="{items}" :pagination="myPostsPagination">
<div class="vfpdbgtk"> <div class="vfpdbgtk">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/> <MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>

View file

@ -18,13 +18,13 @@
</div> </div>
<div class="actions"> <div class="actions">
<div class="like"> <div class="like">
<MkButton v-if="post.isLiked" v-tooltip="$ts._gallery.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton> <MkButton v-if="post.isLiked" v-tooltip="i18n.ts._gallery.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
<MkButton v-else v-tooltip="$ts._gallery.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton> <MkButton v-else v-tooltip="i18n.ts._gallery.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="post.likedCount > 0" class="count">{{ post.likedCount }}</span></MkButton>
</div> </div>
<div class="other"> <div class="other">
<button v-if="$i && $i.id === post.user.id" v-tooltip="$ts.edit" v-click-anime class="_button" @click="edit"><i class="fas fa-pencil-alt fa-fw"></i></button> <button v-if="$i && $i.id === post.user.id" v-tooltip="i18n.ts.edit" v-click-anime class="_button" @click="edit"><i class="fas fa-pencil-alt fa-fw"></i></button>
<button v-tooltip="$ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button> <button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button>
<button v-tooltip="$ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button> <button v-tooltip="i18n.ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button>
</div> </div>
</div> </div>
<div class="user"> <div class="user">
@ -38,7 +38,7 @@
</div> </div>
<MkAd :prefer="['horizontal', 'horizontal-big']"/> <MkAd :prefer="['horizontal', 'horizontal-big']"/>
<MkContainer :max-height="300" :foldable="true" class="other"> <MkContainer :max-height="300" :foldable="true" class="other">
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template> <template #header><i class="fas fa-clock"></i> {{ i18n.ts.recentPosts }}</template>
<MkPagination v-slot="{items}" :pagination="otherPostsPagination"> <MkPagination v-slot="{items}" :pagination="otherPostsPagination">
<div class="sdrarzaf"> <div class="sdrarzaf">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/> <MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>

View file

@ -5,51 +5,51 @@
<div v-if="tab === 'overview'" class="_formRoot"> <div v-if="tab === 'overview'" class="_formRoot">
<div class="fnfelxur"> <div class="fnfelxur">
<img :src="instance.iconUrl || instance.faviconUrl" alt="" class="icon"/> <img :src="instance.iconUrl || instance.faviconUrl" alt="" class="icon"/>
<span class="name">{{ instance.name || `(${$ts.unknown})` }}</span> <span class="name">{{ instance.name || `(${i18n.ts.unknown})` }}</span>
</div> </div>
<MkKeyValue :copy="host" oneline style="margin: 1em 0;"> <MkKeyValue :copy="host" oneline style="margin: 1em 0;">
<template #key>Host</template> <template #key>Host</template>
<template #value><span class="_monospace"><MkLink :url="`https://${host}`">{{ host }}</MkLink></span></template> <template #value><span class="_monospace"><MkLink :url="`https://${host}`">{{ host }}</MkLink></span></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.software }}</template> <template #key>{{ i18n.ts.software }}</template>
<template #value><span class="_monospace">{{ instance.softwareName || `(${$ts.unknown})` }} / {{ instance.softwareVersion || `(${$ts.unknown})` }}</span></template> <template #value><span class="_monospace">{{ instance.softwareName || `(${i18n.ts.unknown})` }} / {{ instance.softwareVersion || `(${i18n.ts.unknown})` }}</span></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.administrator }}</template> <template #key>{{ i18n.ts.administrator }}</template>
<template #value>{{ instance.maintainerName || `(${$ts.unknown})` }} ({{ instance.maintainerEmail || `(${$ts.unknown})` }})</template> <template #value>{{ instance.maintainerName || `(${i18n.ts.unknown})` }} ({{ instance.maintainerEmail || `(${i18n.ts.unknown})` }})</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue> <MkKeyValue>
<template #key>{{ $ts.description }}</template> <template #key>{{ i18n.ts.description }}</template>
<template #value>{{ instance.description }}</template> <template #value>{{ instance.description }}</template>
</MkKeyValue> </MkKeyValue>
<FormSection v-if="iAmModerator"> <FormSection v-if="iAmModerator">
<template #label>Moderation</template> <template #label>Moderation</template>
<FormSwitch v-model="suspended" class="_formBlock" @update:modelValue="toggleSuspend">{{ $ts.stopActivityDelivery }}</FormSwitch> <FormSwitch v-model="suspended" class="_formBlock" @update:modelValue="toggleSuspend">{{ i18n.ts.stopActivityDelivery }}</FormSwitch>
<FormSwitch v-model="isBlocked" class="_formBlock" @update:modelValue="toggleBlock">{{ $ts.blockThisInstance }}</FormSwitch> <FormSwitch v-model="isBlocked" class="_formBlock" @update:modelValue="toggleBlock">{{ i18n.ts.blockThisInstance }}</FormSwitch>
<MkButton @click="refreshMetadata"><i class="fas fa-refresh"></i> Refresh metadata</MkButton> <MkButton @click="refreshMetadata"><i class="fas fa-refresh"></i> Refresh metadata</MkButton>
</FormSection> </FormSection>
<FormSection> <FormSection>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.registeredAt }}</template> <template #key>{{ i18n.ts.registeredAt }}</template>
<template #value><MkTime mode="detail" :time="instance.caughtAt"/></template> <template #value><MkTime mode="detail" :time="instance.caughtAt"/></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.updatedAt }}</template> <template #key>{{ i18n.ts.updatedAt }}</template>
<template #value><MkTime mode="detail" :time="instance.infoUpdatedAt"/></template> <template #value><MkTime mode="detail" :time="instance.infoUpdatedAt"/></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.latestRequestSentAt }}</template> <template #key>{{ i18n.ts.latestRequestSentAt }}</template>
<template #value><MkTime v-if="instance.latestRequestSentAt" :time="instance.latestRequestSentAt"/><span v-else>N/A</span></template> <template #value><MkTime v-if="instance.latestRequestSentAt" :time="instance.latestRequestSentAt"/><span v-else>N/A</span></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.latestStatus }}</template> <template #key>{{ i18n.ts.latestStatus }}</template>
<template #value>{{ instance.latestStatus ? instance.latestStatus : 'N/A' }}</template> <template #value>{{ instance.latestStatus ? instance.latestStatus : 'N/A' }}</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.latestRequestReceivedAt }}</template> <template #key>{{ i18n.ts.latestRequestReceivedAt }}</template>
<template #value><MkTime v-if="instance.latestRequestReceivedAt" :time="instance.latestRequestReceivedAt"/><span v-else>N/A</span></template> <template #value><MkTime v-if="instance.latestRequestReceivedAt" :time="instance.latestRequestReceivedAt"/><span v-else>N/A</span></template>
</MkKeyValue> </MkKeyValue>
</FormSection> </FormSection>
@ -78,17 +78,17 @@
<div class="cmhjzshl"> <div class="cmhjzshl">
<div class="selects"> <div class="selects">
<MkSelect v-model="chartSrc" style="margin: 0 10px 0 0; flex: 1;"> <MkSelect v-model="chartSrc" style="margin: 0 10px 0 0; flex: 1;">
<option value="instance-requests">{{ $ts._instanceCharts.requests }}</option> <option value="instance-requests">{{ i18n.ts._instanceCharts.requests }}</option>
<option value="instance-users">{{ $ts._instanceCharts.users }}</option> <option value="instance-users">{{ i18n.ts._instanceCharts.users }}</option>
<option value="instance-users-total">{{ $ts._instanceCharts.usersTotal }}</option> <option value="instance-users-total">{{ i18n.ts._instanceCharts.usersTotal }}</option>
<option value="instance-notes">{{ $ts._instanceCharts.notes }}</option> <option value="instance-notes">{{ i18n.ts._instanceCharts.notes }}</option>
<option value="instance-notes-total">{{ $ts._instanceCharts.notesTotal }}</option> <option value="instance-notes-total">{{ i18n.ts._instanceCharts.notesTotal }}</option>
<option value="instance-ff">{{ $ts._instanceCharts.ff }}</option> <option value="instance-ff">{{ i18n.ts._instanceCharts.ff }}</option>
<option value="instance-ff-total">{{ $ts._instanceCharts.ffTotal }}</option> <option value="instance-ff-total">{{ i18n.ts._instanceCharts.ffTotal }}</option>
<option value="instance-drive-usage">{{ $ts._instanceCharts.cacheSize }}</option> <option value="instance-drive-usage">{{ i18n.ts._instanceCharts.cacheSize }}</option>
<option value="instance-drive-usage-total">{{ $ts._instanceCharts.cacheSizeTotal }}</option> <option value="instance-drive-usage-total">{{ i18n.ts._instanceCharts.cacheSizeTotal }}</option>
<option value="instance-drive-files">{{ $ts._instanceCharts.files }}</option> <option value="instance-drive-files">{{ i18n.ts._instanceCharts.files }}</option>
<option value="instance-drive-files-total">{{ $ts._instanceCharts.filesTotal }}</option> <option value="instance-drive-files-total">{{ i18n.ts._instanceCharts.filesTotal }}</option>
</MkSelect> </MkSelect>
</div> </div>
<div class="charts"> <div class="charts">

View file

@ -3,11 +3,11 @@
<template #header><MkPageHeader/></template> <template #header><MkPageHeader/></template>
<MkSpacer :content-max="800"> <MkSpacer :content-max="800">
<div class="mwysmxbg"> <div class="mwysmxbg">
<div>{{ $ts._mfm.intro }}</div> <div>{{ i18n.ts._mfm.intro }}</div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.mention }}</div> <div class="title">{{ i18n.ts._mfm.mention }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.mentionDescription }}</p> <p>{{ i18n.ts._mfm.mentionDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_mention"/> <Mfm :text="preview_mention"/>
<MkTextarea v-model="preview_mention"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_mention"><template #label>MFM</template></MkTextarea>
@ -15,9 +15,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.hashtag }}</div> <div class="title">{{ i18n.ts._mfm.hashtag }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.hashtagDescription }}</p> <p>{{ i18n.ts._mfm.hashtagDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_hashtag"/> <Mfm :text="preview_hashtag"/>
<MkTextarea v-model="preview_hashtag"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_hashtag"><template #label>MFM</template></MkTextarea>
@ -25,9 +25,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.url }}</div> <div class="title">{{ i18n.ts._mfm.url }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.urlDescription }}</p> <p>{{ i18n.ts._mfm.urlDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_url"/> <Mfm :text="preview_url"/>
<MkTextarea v-model="preview_url"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_url"><template #label>MFM</template></MkTextarea>
@ -35,9 +35,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.link }}</div> <div class="title">{{ i18n.ts._mfm.link }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.linkDescription }}</p> <p>{{ i18n.ts._mfm.linkDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_link"/> <Mfm :text="preview_link"/>
<MkTextarea v-model="preview_link"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_link"><template #label>MFM</template></MkTextarea>
@ -45,9 +45,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.emoji }}</div> <div class="title">{{ i18n.ts._mfm.emoji }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.emojiDescription }}</p> <p>{{ i18n.ts._mfm.emojiDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_emoji"/> <Mfm :text="preview_emoji"/>
<MkTextarea v-model="preview_emoji"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_emoji"><template #label>MFM</template></MkTextarea>
@ -55,9 +55,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.bold }}</div> <div class="title">{{ i18n.ts._mfm.bold }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.boldDescription }}</p> <p>{{ i18n.ts._mfm.boldDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_bold"/> <Mfm :text="preview_bold"/>
<MkTextarea v-model="preview_bold"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_bold"><template #label>MFM</template></MkTextarea>
@ -65,9 +65,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.small }}</div> <div class="title">{{ i18n.ts._mfm.small }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.smallDescription }}</p> <p>{{ i18n.ts._mfm.smallDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_small"/> <Mfm :text="preview_small"/>
<MkTextarea v-model="preview_small"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_small"><template #label>MFM</template></MkTextarea>
@ -75,9 +75,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.quote }}</div> <div class="title">{{ i18n.ts._mfm.quote }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.quoteDescription }}</p> <p>{{ i18n.ts._mfm.quoteDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_quote"/> <Mfm :text="preview_quote"/>
<MkTextarea v-model="preview_quote"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_quote"><template #label>MFM</template></MkTextarea>
@ -85,9 +85,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.center }}</div> <div class="title">{{ i18n.ts._mfm.center }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.centerDescription }}</p> <p>{{ i18n.ts._mfm.centerDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_center"/> <Mfm :text="preview_center"/>
<MkTextarea v-model="preview_center"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_center"><template #label>MFM</template></MkTextarea>
@ -95,9 +95,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.inlineCode }}</div> <div class="title">{{ i18n.ts._mfm.inlineCode }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.inlineCodeDescription }}</p> <p>{{ i18n.ts._mfm.inlineCodeDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_inlineCode"/> <Mfm :text="preview_inlineCode"/>
<MkTextarea v-model="preview_inlineCode"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_inlineCode"><template #label>MFM</template></MkTextarea>
@ -105,9 +105,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.blockCode }}</div> <div class="title">{{ i18n.ts._mfm.blockCode }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.blockCodeDescription }}</p> <p>{{ i18n.ts._mfm.blockCodeDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_blockCode"/> <Mfm :text="preview_blockCode"/>
<MkTextarea v-model="preview_blockCode"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_blockCode"><template #label>MFM</template></MkTextarea>
@ -115,9 +115,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.inlineMath }}</div> <div class="title">{{ i18n.ts._mfm.inlineMath }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.inlineMathDescription }}</p> <p>{{ i18n.ts._mfm.inlineMathDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_inlineMath"/> <Mfm :text="preview_inlineMath"/>
<MkTextarea v-model="preview_inlineMath"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_inlineMath"><template #label>MFM</template></MkTextarea>
@ -126,9 +126,9 @@
</div> </div>
<!-- deprecated <!-- deprecated
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.search }}</div> <div class="title">{{ i18n.ts._mfm.search }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.searchDescription }}</p> <p>{{ i18n.ts._mfm.searchDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_search"/> <Mfm :text="preview_search"/>
<MkTextarea v-model="preview_search"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_search"><template #label>MFM</template></MkTextarea>
@ -137,9 +137,9 @@
</div> </div>
--> -->
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.flip }}</div> <div class="title">{{ i18n.ts._mfm.flip }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.flipDescription }}</p> <p>{{ i18n.ts._mfm.flipDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_flip"/> <Mfm :text="preview_flip"/>
<MkTextarea v-model="preview_flip"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_flip"><template #label>MFM</template></MkTextarea>
@ -147,9 +147,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.font }}</div> <div class="title">{{ i18n.ts._mfm.font }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.fontDescription }}</p> <p>{{ i18n.ts._mfm.fontDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_font"/> <Mfm :text="preview_font"/>
<MkTextarea v-model="preview_font"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_font"><template #label>MFM</template></MkTextarea>
@ -157,9 +157,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.x2 }}</div> <div class="title">{{ i18n.ts._mfm.x2 }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.x2Description }}</p> <p>{{ i18n.ts._mfm.x2Description }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_x2"/> <Mfm :text="preview_x2"/>
<MkTextarea v-model="preview_x2"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_x2"><template #label>MFM</template></MkTextarea>
@ -167,9 +167,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.x3 }}</div> <div class="title">{{ i18n.ts._mfm.x3 }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.x3Description }}</p> <p>{{ i18n.ts._mfm.x3Description }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_x3"/> <Mfm :text="preview_x3"/>
<MkTextarea v-model="preview_x3"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_x3"><template #label>MFM</template></MkTextarea>
@ -177,9 +177,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.x4 }}</div> <div class="title">{{ i18n.ts._mfm.x4 }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.x4Description }}</p> <p>{{ i18n.ts._mfm.x4Description }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_x4"/> <Mfm :text="preview_x4"/>
<MkTextarea v-model="preview_x4"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_x4"><template #label>MFM</template></MkTextarea>
@ -187,9 +187,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.blur }}</div> <div class="title">{{ i18n.ts._mfm.blur }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.blurDescription }}</p> <p>{{ i18n.ts._mfm.blurDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_blur"/> <Mfm :text="preview_blur"/>
<MkTextarea v-model="preview_blur"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_blur"><template #label>MFM</template></MkTextarea>
@ -197,9 +197,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.jelly }}</div> <div class="title">{{ i18n.ts._mfm.jelly }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.jellyDescription }}</p> <p>{{ i18n.ts._mfm.jellyDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_jelly"/> <Mfm :text="preview_jelly"/>
<MkTextarea v-model="preview_jelly"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_jelly"><template #label>MFM</template></MkTextarea>
@ -207,9 +207,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.tada }}</div> <div class="title">{{ i18n.ts._mfm.tada }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.tadaDescription }}</p> <p>{{ i18n.ts._mfm.tadaDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_tada"/> <Mfm :text="preview_tada"/>
<MkTextarea v-model="preview_tada"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_tada"><template #label>MFM</template></MkTextarea>
@ -217,9 +217,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.jump }}</div> <div class="title">{{ i18n.ts._mfm.jump }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.jumpDescription }}</p> <p>{{ i18n.ts._mfm.jumpDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_jump"/> <Mfm :text="preview_jump"/>
<MkTextarea v-model="preview_jump"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_jump"><template #label>MFM</template></MkTextarea>
@ -227,9 +227,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.bounce }}</div> <div class="title">{{ i18n.ts._mfm.bounce }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.bounceDescription }}</p> <p>{{ i18n.ts._mfm.bounceDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_bounce"/> <Mfm :text="preview_bounce"/>
<MkTextarea v-model="preview_bounce"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_bounce"><template #label>MFM</template></MkTextarea>
@ -237,9 +237,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.spin }}</div> <div class="title">{{ i18n.ts._mfm.spin }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.spinDescription }}</p> <p>{{ i18n.ts._mfm.spinDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_spin"/> <Mfm :text="preview_spin"/>
<MkTextarea v-model="preview_spin"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_spin"><template #label>MFM</template></MkTextarea>
@ -247,9 +247,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.shake }}</div> <div class="title">{{ i18n.ts._mfm.shake }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.shakeDescription }}</p> <p>{{ i18n.ts._mfm.shakeDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_shake"/> <Mfm :text="preview_shake"/>
<MkTextarea v-model="preview_shake"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_shake"><template #label>MFM</template></MkTextarea>
@ -257,9 +257,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.twitch }}</div> <div class="title">{{ i18n.ts._mfm.twitch }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.twitchDescription }}</p> <p>{{ i18n.ts._mfm.twitchDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_twitch"/> <Mfm :text="preview_twitch"/>
<MkTextarea v-model="preview_twitch"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_twitch"><template #label>MFM</template></MkTextarea>
@ -267,9 +267,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.rainbow }}</div> <div class="title">{{ i18n.ts._mfm.rainbow }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.rainbowDescription }}</p> <p>{{ i18n.ts._mfm.rainbowDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_rainbow"/> <Mfm :text="preview_rainbow"/>
<MkTextarea v-model="preview_rainbow"><template #label>MFM</template></MkTextarea> <MkTextarea v-model="preview_rainbow"><template #label>MFM</template></MkTextarea>
@ -277,9 +277,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.sparkle }}</div> <div class="title">{{ i18n.ts._mfm.sparkle }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.sparkleDescription }}</p> <p>{{ i18n.ts._mfm.sparkleDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_sparkle"/> <Mfm :text="preview_sparkle"/>
<MkTextarea v-model="preview_sparkle"><span>MFM</span></MkTextarea> <MkTextarea v-model="preview_sparkle"><span>MFM</span></MkTextarea>
@ -287,9 +287,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.rotate }}</div> <div class="title">{{ i18n.ts._mfm.rotate }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.rotateDescription }}</p> <p>{{ i18n.ts._mfm.rotateDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_rotate"/> <Mfm :text="preview_rotate"/>
<MkTextarea v-model="preview_rotate"><span>MFM</span></MkTextarea> <MkTextarea v-model="preview_rotate"><span>MFM</span></MkTextarea>
@ -297,9 +297,9 @@
</div> </div>
</div> </div>
<div class="section _block"> <div class="section _block">
<div class="title">{{ $ts._mfm.plain }}</div> <div class="title">{{ i18n.ts._mfm.plain }}</div>
<div class="content"> <div class="content">
<p>{{ $ts._mfm.plainDescription }}</p> <p>{{ i18n.ts._mfm.plainDescription }}</p>
<div class="preview"> <div class="preview">
<Mfm :text="preview_plain"/> <Mfm :text="preview_plain"/>
<MkTextarea v-model="preview_plain"><span>MFM</span></MkTextarea> <MkTextarea v-model="preview_plain"><span>MFM</span></MkTextarea>

View file

@ -2,44 +2,44 @@
<div class="shaynizk"> <div class="shaynizk">
<div class="form"> <div class="form">
<MkInput v-model="name" class="_formBlock"> <MkInput v-model="name" class="_formBlock">
<template #label>{{ $ts.name }}</template> <template #label>{{ i18n.ts.name }}</template>
</MkInput> </MkInput>
<MkSelect v-model="src" class="_formBlock"> <MkSelect v-model="src" class="_formBlock">
<template #label>{{ $ts.antennaSource }}</template> <template #label>{{ i18n.ts.antennaSource }}</template>
<option value="all">{{ $ts._antennaSources.all }}</option> <option value="all">{{ i18n.ts._antennaSources.all }}</option>
<!--<option value="home">{{ $ts._antennaSources.homeTimeline }}</option>--> <!--<option value="home">{{ i18n.ts._antennaSources.homeTimeline }}</option>-->
<option value="users">{{ $ts._antennaSources.users }}</option> <option value="users">{{ i18n.ts._antennaSources.users }}</option>
<!--<option value="list">{{ $ts._antennaSources.userList }}</option>--> <!--<option value="list">{{ i18n.ts._antennaSources.userList }}</option>-->
<!--<option value="group">{{ $ts._antennaSources.userGroup }}</option>--> <!--<option value="group">{{ i18n.ts._antennaSources.userGroup }}</option>-->
</MkSelect> </MkSelect>
<MkSelect v-if="src === 'list'" v-model="userListId" class="_formBlock"> <MkSelect v-if="src === 'list'" v-model="userListId" class="_formBlock">
<template #label>{{ $ts.userList }}</template> <template #label>{{ i18n.ts.userList }}</template>
<option v-for="list in userLists" :key="list.id" :value="list.id">{{ list.name }}</option> <option v-for="list in userLists" :key="list.id" :value="list.id">{{ list.name }}</option>
</MkSelect> </MkSelect>
<MkSelect v-else-if="src === 'group'" v-model="userGroupId" class="_formBlock"> <MkSelect v-else-if="src === 'group'" v-model="userGroupId" class="_formBlock">
<template #label>{{ $ts.userGroup }}</template> <template #label>{{ i18n.ts.userGroup }}</template>
<option v-for="group in userGroups" :key="group.id" :value="group.id">{{ group.name }}</option> <option v-for="group in userGroups" :key="group.id" :value="group.id">{{ group.name }}</option>
</MkSelect> </MkSelect>
<MkTextarea v-else-if="src === 'users'" v-model="users" class="_formBlock"> <MkTextarea v-else-if="src === 'users'" v-model="users" class="_formBlock">
<template #label>{{ $ts.users }}</template> <template #label>{{ i18n.ts.users }}</template>
<template #caption>{{ $ts.antennaUsersDescription }} <button class="_textButton" @click="addUser">{{ $ts.addUser }}</button></template> <template #caption>{{ i18n.ts.antennaUsersDescription }} <button class="_textButton" @click="addUser">{{ i18n.ts.addUser }}</button></template>
</MkTextarea> </MkTextarea>
<MkSwitch v-model="withReplies" class="_formBlock">{{ $ts.withReplies }}</MkSwitch> <MkSwitch v-model="withReplies" class="_formBlock">{{ i18n.ts.withReplies }}</MkSwitch>
<MkTextarea v-model="keywords" class="_formBlock"> <MkTextarea v-model="keywords" class="_formBlock">
<template #label>{{ $ts.antennaKeywords }}</template> <template #label>{{ i18n.ts.antennaKeywords }}</template>
<template #caption>{{ $ts.antennaKeywordsDescription }}</template> <template #caption>{{ i18n.ts.antennaKeywordsDescription }}</template>
</MkTextarea> </MkTextarea>
<MkTextarea v-model="excludeKeywords" class="_formBlock"> <MkTextarea v-model="excludeKeywords" class="_formBlock">
<template #label>{{ $ts.antennaExcludeKeywords }}</template> <template #label>{{ i18n.ts.antennaExcludeKeywords }}</template>
<template #caption>{{ $ts.antennaKeywordsDescription }}</template> <template #caption>{{ i18n.ts.antennaKeywordsDescription }}</template>
</MkTextarea> </MkTextarea>
<MkSwitch v-model="caseSensitive" class="_formBlock">{{ $ts.caseSensitive }}</MkSwitch> <MkSwitch v-model="caseSensitive" class="_formBlock">{{ i18n.ts.caseSensitive }}</MkSwitch>
<MkSwitch v-model="withFile" class="_formBlock">{{ $ts.withFileAntenna }}</MkSwitch> <MkSwitch v-model="withFile" class="_formBlock">{{ i18n.ts.withFileAntenna }}</MkSwitch>
<MkSwitch v-model="notify" class="_formBlock">{{ $ts.notifyAntenna }}</MkSwitch> <MkSwitch v-model="notify" class="_formBlock">{{ i18n.ts.notifyAntenna }}</MkSwitch>
</div> </div>
<div class="actions"> <div class="actions">
<MkButton inline primary @click="saveAntenna()"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton> <MkButton inline primary @click="saveAntenna()"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
<MkButton v-if="antenna.id != null" inline danger @click="deleteAntenna()"><i class="fas fa-trash"></i> {{ $ts.delete }}</MkButton> <MkButton v-if="antenna.id != null" inline danger @click="deleteAntenna()"><i class="fas fa-trash"></i> {{ i18n.ts.delete }}</MkButton>
</div> </div>
</div> </div>
</template> </template>

View file

@ -1,17 +1,19 @@
<template><MkStickyContainer> <template>
<MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :content-max="700"> <MkSpacer :content-max="700">
<div class="qtcaoidl"> <div class="qtcaoidl">
<MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ $ts.add }}</MkButton> <MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ i18n.ts.add }}</MkButton>
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="list"> <MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="list">
<MkA v-for="item in items" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap"> <MkA v-for="item in items" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap">
<b>{{ item.name }}</b> <b>{{ item.name }}</b>
<div v-if="item.description" class="description">{{ item.description }}</div> <div v-if="item.description" class="description">{{ item.description }}</div>
</MkA> </MkA>
</MkPagination> </MkPagination>
</div> </div>
</MkSpacer></MkStickyContainer> </MkSpacer>
</MkStickyContainer>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

View file

@ -1,17 +1,19 @@
<template><MkStickyContainer> <template>
<MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :content-max="700"> <MkSpacer :content-max="700">
<div class="qkcjvfiv"> <div class="qkcjvfiv">
<MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ $ts.createList }}</MkButton> <MkButton primary class="add" @click="create"><i class="fas fa-plus"></i> {{ i18n.ts.createList }}</MkButton>
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="lists _content"> <MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination" class="lists _content">
<MkA v-for="list in items" :key="list.id" class="list _panel" :to="`/my/lists/${ list.id }`"> <MkA v-for="list in items" :key="list.id" class="list _panel" :to="`/my/lists/${ list.id }`">
<div class="name">{{ list.name }}</div> <div class="name">{{ list.name }}</div>
<MkAvatars :user-ids="list.userIds"/> <MkAvatars :user-ids="list.userIds"/>
</MkA> </MkA>
</MkPagination> </MkPagination>
</div> </div>
</MkSpacer></MkStickyContainer> </MkSpacer>
</MkStickyContainer>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>

View file

@ -1,42 +1,44 @@
<template><MkStickyContainer> <template>
<MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :content-max="700"> <MkSpacer :content-max="700">
<div class="mk-list-page"> <div class="mk-list-page">
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
<div v-if="list" class="_section"> <div v-if="list" class="_section">
<div class="_content"> <div class="_content">
<MkButton inline @click="addUser()">{{ $ts.addUser }}</MkButton> <MkButton inline @click="addUser()">{{ i18n.ts.addUser }}</MkButton>
<MkButton inline @click="renameList()">{{ $ts.rename }}</MkButton> <MkButton inline @click="renameList()">{{ i18n.ts.rename }}</MkButton>
<MkButton inline @click="deleteList()">{{ $ts.delete }}</MkButton> <MkButton inline @click="deleteList()">{{ i18n.ts.delete }}</MkButton>
</div>
</div> </div>
</div> </transition>
</transition>
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in"> <transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
<div v-if="list" class="_section members _gap"> <div v-if="list" class="_section members _gap">
<div class="_title">{{ $ts.members }}</div> <div class="_title">{{ i18n.ts.members }}</div>
<div class="_content"> <div class="_content">
<div class="users"> <div class="users">
<div v-for="user in users" :key="user.id" class="user _panel"> <div v-for="user in users" :key="user.id" class="user _panel">
<MkAvatar :user="user" class="avatar" :show-indicator="true"/> <MkAvatar :user="user" class="avatar" :show-indicator="true"/>
<div class="body"> <div class="body">
<MkUserName :user="user" class="name"/> <MkUserName :user="user" class="name"/>
<MkAcct :user="user" class="acct"/> <MkAcct :user="user" class="acct"/>
</div> </div>
<div class="action"> <div class="action">
<button class="_button" @click="removeUser(user)"><i class="fas fa-times"></i></button> <button class="_button" @click="removeUser(user)"><i class="fas fa-times"></i></button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </transition>
</transition> </div>
</div> </MkSpacer>
</MkSpacer></MkStickyContainer> </MkStickyContainer>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed, defineComponent, watch } from 'vue'; import { computed, watch } from 'vue';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import * as os from '@/os'; import * as os from '@/os';
import { mainRouter } from '@/router'; import { mainRouter } from '@/router';

View file

@ -2,7 +2,7 @@
<div class="ipledcug"> <div class="ipledcug">
<div class="_fullinfo"> <div class="_fullinfo">
<img src="/static-assets/badges/not-found.jpg" class="_ghost" alt="Not found"/> <img src="/static-assets/badges/not-found.jpg" class="_ghost" alt="Not found"/>
<div>{{ $ts.notFoundDescription }}</div> <div>{{ i18n.ts.notFoundDescription }}</div>
</div> </div>
</div> </div>
</template> </template>

View file

@ -16,7 +16,7 @@
<XNoteDetailed :key="note.id" v-model:note="note" class="note"/> <XNoteDetailed :key="note.id" v-model:note="note" class="note"/>
</div> </div>
<div v-if="clips && clips.length > 0" class="_content clips _gap"> <div v-if="clips && clips.length > 0" class="_content clips _gap">
<div class="title">{{ $ts.clip }}</div> <div class="title">{{ i18n.ts.clip }}</div>
<MkA v-for="item in clips" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap"> <MkA v-for="item in clips" :key="item.id" :to="`/clips/${item.id}`" class="item _panel _gap">
<b>{{ item.name }}</b> <b>{{ item.name }}</b>
<div v-if="item.description" class="description">{{ item.description }}</div> <div v-if="item.description" class="description">{{ item.description }}</div>

View file

@ -18,12 +18,12 @@
</div> </div>
<div class="actions"> <div class="actions">
<div class="like"> <div class="like">
<MkButton v-if="page.isLiked" v-tooltip="$ts._pages.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton> <MkButton v-if="page.isLiked" v-tooltip="i18n.ts._pages.unlike" class="button" primary @click="unlike()"><i class="fas fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
<MkButton v-else v-tooltip="$ts._pages.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton> <MkButton v-else v-tooltip="i18n.ts._pages.like" class="button" @click="like()"><i class="far fa-heart"></i><span v-if="page.likedCount > 0" class="count">{{ page.likedCount }}</span></MkButton>
</div> </div>
<div class="other"> <div class="other">
<button v-tooltip="$ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button> <button v-tooltip="i18n.ts.shareWithNote" v-click-anime class="_button" @click="shareWithNote"><i class="fas fa-retweet fa-fw"></i></button>
<button v-tooltip="$ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button> <button v-tooltip="i18n.ts.share" v-click-anime class="_button" @click="share"><i class="fas fa-share-alt fa-fw"></i></button>
</div> </div>
</div> </div>
<div class="user"> <div class="user">
@ -35,21 +35,21 @@
<MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/> <MkFollowButton v-if="!$i || $i.id != page.user.id" :user="page.user" :inline="true" :transparent="false" :full="true" large class="koudoku"/>
</div> </div>
<div class="links"> <div class="links">
<MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ $ts._pages.viewSource }}</MkA> <MkA :to="`/@${username}/pages/${pageName}/view-source`" class="link">{{ i18n.ts._pages.viewSource }}</MkA>
<template v-if="$i && $i.id === page.userId"> <template v-if="$i && $i.id === page.userId">
<MkA :to="`/pages/edit/${page.id}`" class="link">{{ $ts._pages.editThisPage }}</MkA> <MkA :to="`/pages/edit/${page.id}`" class="link">{{ i18n.ts._pages.editThisPage }}</MkA>
<button v-if="$i.pinnedPageId === page.id" class="link _textButton" @click="pin(false)">{{ $ts.unpin }}</button> <button v-if="$i.pinnedPageId === page.id" class="link _textButton" @click="pin(false)">{{ i18n.ts.unpin }}</button>
<button v-else class="link _textButton" @click="pin(true)">{{ $ts.pin }}</button> <button v-else class="link _textButton" @click="pin(true)">{{ i18n.ts.pin }}</button>
</template> </template>
</div> </div>
</div> </div>
<div class="footer"> <div class="footer">
<div><i class="far fa-clock"></i> {{ $ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div> <div><i class="far fa-clock"></i> {{ i18n.ts.createdAt }}: <MkTime :time="page.createdAt" mode="detail"/></div>
<div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ $ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div> <div v-if="page.createdAt != page.updatedAt"><i class="far fa-clock"></i> {{ i18n.ts.updatedAt }}: <MkTime :time="page.updatedAt" mode="detail"/></div>
</div> </div>
<MkAd :prefer="['horizontal', 'horizontal-big']"/> <MkAd :prefer="['horizontal', 'horizontal-big']"/>
<MkContainer :max-height="300" :foldable="true" class="other"> <MkContainer :max-height="300" :foldable="true" class="other">
<template #header><i class="fas fa-clock"></i> {{ $ts.recentPosts }}</template> <template #header><i class="fas fa-clock"></i> {{ i18n.ts.recentPosts }}</template>
<MkPagination v-slot="{items}" :pagination="otherPostsPagination"> <MkPagination v-slot="{items}" :pagination="otherPostsPagination">
<MkPagePreview v-for="page in items" :key="page.id" :page="page" class="_gap"/> <MkPagePreview v-for="page in items" :key="page.id" :page="page" class="_gap"/>
</MkPagination> </MkPagination>

View file

@ -4,11 +4,11 @@
<MkSpacer :content-max="600" :margin-min="16"> <MkSpacer :content-max="600" :margin-min="16">
<FormSplit> <FormSplit>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts._registry.domain }}</template> <template #key>{{ i18n.ts._registry.domain }}</template>
<template #value>{{ $ts.system }}</template> <template #value>{{ i18n.ts.system }}</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts._registry.scope }}</template> <template #key>{{ i18n.ts._registry.scope }}</template>
<template #value>{{ scope.join('/') }}</template> <template #value>{{ scope.join('/') }}</template>
</MkKeyValue> </MkKeyValue>
</FormSplit> </FormSplit>

View file

@ -2,36 +2,36 @@
<MkStickyContainer> <MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :content-max="600" :margin-min="16"> <MkSpacer :content-max="600" :margin-min="16">
<FormInfo warn>{{ $ts.editTheseSettingsMayBreakAccount }}</FormInfo> <FormInfo warn>{{ i18n.ts.editTheseSettingsMayBreakAccount }}</FormInfo>
<template v-if="value"> <template v-if="value">
<FormSplit> <FormSplit>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts._registry.domain }}</template> <template #key>{{ i18n.ts._registry.domain }}</template>
<template #value>{{ $ts.system }}</template> <template #value>{{ i18n.ts.system }}</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts._registry.scope }}</template> <template #key>{{ i18n.ts._registry.scope }}</template>
<template #value>{{ scope.join('/') }}</template> <template #value>{{ scope.join('/') }}</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts._registry.key }}</template> <template #key>{{ i18n.ts._registry.key }}</template>
<template #value>{{ key }}</template> <template #value>{{ key }}</template>
</MkKeyValue> </MkKeyValue>
</FormSplit> </FormSplit>
<FormTextarea v-model="valueForEditor" tall class="_formBlock _monospace"> <FormTextarea v-model="valueForEditor" tall class="_formBlock _monospace">
<template #label>{{ $ts.value }} (JSON)</template> <template #label>{{ i18n.ts.value }} (JSON)</template>
</FormTextarea> </FormTextarea>
<MkButton class="_formBlock" primary @click="save"><i class="fas fa-save"></i> {{ $ts.save }}</MkButton> <MkButton class="_formBlock" primary @click="save"><i class="fas fa-save"></i> {{ i18n.ts.save }}</MkButton>
<MkKeyValue class="_formBlock"> <MkKeyValue class="_formBlock">
<template #key>{{ $ts.updatedAt }}</template> <template #key>{{ i18n.ts.updatedAt }}</template>
<template #value><MkTime :time="value.updatedAt" mode="detail"/></template> <template #value><MkTime :time="value.updatedAt" mode="detail"/></template>
</MkKeyValue> </MkKeyValue>
<MkButton danger @click="del"><i class="fas fa-trash"></i> {{ $ts.delete }}</MkButton> <MkButton danger @click="del"><i class="fas fa-trash"></i> {{ i18n.ts.delete }}</MkButton>
</template> </template>
</MkSpacer> </MkSpacer>
</MkStickyContainer> </MkStickyContainer>

View file

@ -1,39 +1,39 @@
<template> <template>
<div class="_formRoot"> <div class="_formRoot">
<FormSection> <FormSection>
<template #label>{{ $ts.emailAddress }}</template> <template #label>{{ i18n.ts.emailAddress }}</template>
<FormInput v-model="emailAddress" type="email" manual-save> <FormInput v-model="emailAddress" type="email" manual-save>
<template #prefix><i class="fas fa-envelope"></i></template> <template #prefix><i class="fas fa-envelope"></i></template>
<template v-if="$i.email && !$i.emailVerified" #caption>{{ $ts.verificationEmailSent }}</template> <template v-if="$i.email && !$i.emailVerified" #caption>{{ i18n.ts.verificationEmailSent }}</template>
<template v-else-if="emailAddress === $i.email && $i.emailVerified" #caption><i class="fas fa-check" style="color: var(--success);"></i> {{ $ts.emailVerified }}</template> <template v-else-if="emailAddress === $i.email && $i.emailVerified" #caption><i class="fas fa-check" style="color: var(--success);"></i> {{ i18n.ts.emailVerified }}</template>
</FormInput> </FormInput>
</FormSection> </FormSection>
<FormSection> <FormSection>
<FormSwitch :model-value="$i.receiveAnnouncementEmail" @update:modelValue="onChangeReceiveAnnouncementEmail"> <FormSwitch :model-value="$i.receiveAnnouncementEmail" @update:modelValue="onChangeReceiveAnnouncementEmail">
{{ $ts.receiveAnnouncementFromInstance }} {{ i18n.ts.receiveAnnouncementFromInstance }}
</FormSwitch> </FormSwitch>
</FormSection> </FormSection>
<FormSection> <FormSection>
<template #label>{{ $ts.emailNotification }}</template> <template #label>{{ i18n.ts.emailNotification }}</template>
<FormSwitch v-model="emailNotification_mention" class="_formBlock"> <FormSwitch v-model="emailNotification_mention" class="_formBlock">
{{ $ts._notification._types.mention }} {{ i18n.ts._notification._types.mention }}
</FormSwitch> </FormSwitch>
<FormSwitch v-model="emailNotification_reply" class="_formBlock"> <FormSwitch v-model="emailNotification_reply" class="_formBlock">
{{ $ts._notification._types.reply }} {{ i18n.ts._notification._types.reply }}
</FormSwitch> </FormSwitch>
<FormSwitch v-model="emailNotification_quote" class="_formBlock"> <FormSwitch v-model="emailNotification_quote" class="_formBlock">
{{ $ts._notification._types.quote }} {{ i18n.ts._notification._types.quote }}
</FormSwitch> </FormSwitch>
<FormSwitch v-model="emailNotification_follow" class="_formBlock"> <FormSwitch v-model="emailNotification_follow" class="_formBlock">
{{ $ts._notification._types.follow }} {{ i18n.ts._notification._types.follow }}
</FormSwitch> </FormSwitch>
<FormSwitch v-model="emailNotification_receiveFollowRequest" class="_formBlock"> <FormSwitch v-model="emailNotification_receiveFollowRequest" class="_formBlock">
{{ $ts._notification._types.receiveFollowRequest }} {{ i18n.ts._notification._types.receiveFollowRequest }}
</FormSwitch> </FormSwitch>
<FormSwitch v-model="emailNotification_groupInvited" class="_formBlock"> <FormSwitch v-model="emailNotification_groupInvited" class="_formBlock">
{{ $ts._notification._types.groupInvited }} {{ i18n.ts._notification._types.groupInvited }}
</FormSwitch> </FormSwitch>
</FormSection> </FormSection>
</div> </div>

View file

@ -1,69 +1,69 @@
<template> <template>
<div class="_formRoot"> <div class="_formRoot">
<FormSection> <FormSection>
<template #label>{{ $ts._exportOrImport.allNotes }}</template> <template #label>{{ i18n.ts._exportOrImport.allNotes }}</template>
<FormFolder> <FormFolder>
<template #label>{{ $ts.export }}</template> <template #label>{{ i18n.ts.export }}</template>
<template #icon><i class="fas fa-download"></i></template> <template #icon><i class="fas fa-download"></i></template>
<MkButton primary :class="$style.button" inline @click="exportNotes()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton> <MkButton primary :class="$style.button" inline @click="exportNotes()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
</FormFolder> </FormFolder>
</FormSection> </FormSection>
<FormSection> <FormSection>
<template #label>{{ $ts._exportOrImport.followingList }}</template> <template #label>{{ i18n.ts._exportOrImport.followingList }}</template>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.export }}</template> <template #label>{{ i18n.ts.export }}</template>
<template #icon><i class="fas fa-download"></i></template> <template #icon><i class="fas fa-download"></i></template>
<FormSwitch v-model="excludeMutingUsers" class="_formBlock"> <FormSwitch v-model="excludeMutingUsers" class="_formBlock">
{{ $ts._exportOrImport.excludeMutingUsers }} {{ i18n.ts._exportOrImport.excludeMutingUsers }}
</FormSwitch> </FormSwitch>
<FormSwitch v-model="excludeInactiveUsers" class="_formBlock"> <FormSwitch v-model="excludeInactiveUsers" class="_formBlock">
{{ $ts._exportOrImport.excludeInactiveUsers }} {{ i18n.ts._exportOrImport.excludeInactiveUsers }}
</FormSwitch> </FormSwitch>
<MkButton primary :class="$style.button" inline @click="exportFollowing()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton> <MkButton primary :class="$style.button" inline @click="exportFollowing()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
</FormFolder> </FormFolder>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.import }}</template> <template #label>{{ i18n.ts.import }}</template>
<template #icon><i class="fas fa-upload"></i></template> <template #icon><i class="fas fa-upload"></i></template>
<MkButton primary :class="$style.button" inline @click="importFollowing($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton> <MkButton primary :class="$style.button" inline @click="importFollowing($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
</FormFolder> </FormFolder>
</FormSection> </FormSection>
<FormSection> <FormSection>
<template #label>{{ $ts._exportOrImport.userLists }}</template> <template #label>{{ i18n.ts._exportOrImport.userLists }}</template>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.export }}</template> <template #label>{{ i18n.ts.export }}</template>
<template #icon><i class="fas fa-download"></i></template> <template #icon><i class="fas fa-download"></i></template>
<MkButton primary :class="$style.button" inline @click="exportUserLists()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton> <MkButton primary :class="$style.button" inline @click="exportUserLists()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
</FormFolder> </FormFolder>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.import }}</template> <template #label>{{ i18n.ts.import }}</template>
<template #icon><i class="fas fa-upload"></i></template> <template #icon><i class="fas fa-upload"></i></template>
<MkButton primary :class="$style.button" inline @click="importUserLists($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton> <MkButton primary :class="$style.button" inline @click="importUserLists($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
</FormFolder> </FormFolder>
</FormSection> </FormSection>
<FormSection> <FormSection>
<template #label>{{ $ts._exportOrImport.muteList }}</template> <template #label>{{ i18n.ts._exportOrImport.muteList }}</template>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.export }}</template> <template #label>{{ i18n.ts.export }}</template>
<template #icon><i class="fas fa-download"></i></template> <template #icon><i class="fas fa-download"></i></template>
<MkButton primary :class="$style.button" inline @click="exportMuting()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton> <MkButton primary :class="$style.button" inline @click="exportMuting()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
</FormFolder> </FormFolder>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.import }}</template> <template #label>{{ i18n.ts.import }}</template>
<template #icon><i class="fas fa-upload"></i></template> <template #icon><i class="fas fa-upload"></i></template>
<MkButton primary :class="$style.button" inline @click="importMuting($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton> <MkButton primary :class="$style.button" inline @click="importMuting($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
</FormFolder> </FormFolder>
</FormSection> </FormSection>
<FormSection> <FormSection>
<template #label>{{ $ts._exportOrImport.blockingList }}</template> <template #label>{{ i18n.ts._exportOrImport.blockingList }}</template>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.export }}</template> <template #label>{{ i18n.ts.export }}</template>
<template #icon><i class="fas fa-download"></i></template> <template #icon><i class="fas fa-download"></i></template>
<MkButton primary :class="$style.button" inline @click="exportBlocking()"><i class="fas fa-download"></i> {{ $ts.export }}</MkButton> <MkButton primary :class="$style.button" inline @click="exportBlocking()"><i class="fas fa-download"></i> {{ i18n.ts.export }}</MkButton>
</FormFolder> </FormFolder>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>{{ $ts.import }}</template> <template #label>{{ i18n.ts.import }}</template>
<template #icon><i class="fas fa-upload"></i></template> <template #icon><i class="fas fa-upload"></i></template>
<MkButton primary :class="$style.button" inline @click="importBlocking($event)"><i class="fas fa-upload"></i> {{ $ts.import }}</MkButton> <MkButton primary :class="$style.button" inline @click="importBlocking($event)"><i class="fas fa-upload"></i> {{ i18n.ts.import }}</MkButton>
</FormFolder> </FormFolder>
</FormSection> </FormSection>
</div> </div>

View file

@ -4,15 +4,15 @@
<MkSpacer :content-max="900" :margin-min="20" :margin-max="32"> <MkSpacer :content-max="900" :margin-min="20" :margin-max="32">
<div ref="el" class="vvcocwet" :class="{ wide: !narrow }"> <div ref="el" class="vvcocwet" :class="{ wide: !narrow }">
<div class="body"> <div class="body">
<div v-if="!narrow || initialPage == null" class="nav"> <div v-if="!narrow || currentPage?.route.name == null" class="nav">
<div class="baaadecd"> <div class="baaadecd">
<MkInfo v-if="emailNotConfigured" warn class="info">{{ $ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ $ts.configure }}</MkA></MkInfo> <MkInfo v-if="emailNotConfigured" warn class="info">{{ i18n.ts.emailNotConfiguredWarning }} <MkA to="/settings/email" class="_link">{{ i18n.ts.configure }}</MkA></MkInfo>
<MkSuperMenu :def="menuDef" :grid="initialPage == null"></MkSuperMenu> <MkSuperMenu :def="menuDef" :grid="currentPage?.route.name == null"></MkSuperMenu>
</div> </div>
</div> </div>
<div v-if="!(narrow && initialPage == null)" class="main"> <div v-if="!(narrow && currentPage?.route.name == null)" class="main">
<div class="bkzroven"> <div class="bkzroven">
<component :is="component" :key="initialPage" v-bind="pageProps"/> <RouterView/>
</div> </div>
</div> </div>
</div> </div>
@ -22,7 +22,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed, defineAsyncComponent, inject, nextTick, onMounted, onUnmounted, provide, ref, watch } from 'vue'; import { computed, defineAsyncComponent, inject, nextTick, onActivated, onMounted, onUnmounted, provide, ref, watch } from 'vue';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import MkInfo from '@/components/ui/info.vue'; import MkInfo from '@/components/ui/info.vue';
import MkSuperMenu from '@/components/ui/super-menu.vue'; import MkSuperMenu from '@/components/ui/super-menu.vue';
@ -34,11 +34,6 @@ import { useRouter } from '@/router';
import { definePageMetadata, provideMetadataReceiver, setPageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata, provideMetadataReceiver, setPageMetadata } from '@/scripts/page-metadata';
import * as os from '@/os'; import * as os from '@/os';
const props = withDefaults(defineProps<{
initialPage?: string;
}>(), {
});
const indexInfo = { const indexInfo = {
title: i18n.ts.settings, title: i18n.ts.settings,
icon: 'fas fa-cog', icon: 'fas fa-cog',
@ -50,12 +45,14 @@ const childInfo = ref(null);
const router = useRouter(); const router = useRouter();
const narrow = ref(false); let narrow = $ref(false);
const NARROW_THRESHOLD = 600; const NARROW_THRESHOLD = 600;
let currentPage = $computed(() => router.currentRef.value.child);
const ro = new ResizeObserver((entries, observer) => { const ro = new ResizeObserver((entries, observer) => {
if (entries.length === 0) return; if (entries.length === 0) return;
narrow.value = entries[0].borderBoxSize[0].inlineSize < NARROW_THRESHOLD; narrow = entries[0].borderBoxSize[0].inlineSize < NARROW_THRESHOLD;
}); });
const menuDef = computed(() => [{ const menuDef = computed(() => [{
@ -64,42 +61,42 @@ const menuDef = computed(() => [{
icon: 'fas fa-user', icon: 'fas fa-user',
text: i18n.ts.profile, text: i18n.ts.profile,
to: '/settings/profile', to: '/settings/profile',
active: props.initialPage === 'profile', active: currentPage?.route.name === 'profile',
}, { }, {
icon: 'fas fa-lock-open', icon: 'fas fa-lock-open',
text: i18n.ts.privacy, text: i18n.ts.privacy,
to: '/settings/privacy', to: '/settings/privacy',
active: props.initialPage === 'privacy', active: currentPage?.route.name === 'privacy',
}, { }, {
icon: 'fas fa-laugh', icon: 'fas fa-laugh',
text: i18n.ts.reaction, text: i18n.ts.reaction,
to: '/settings/reaction', to: '/settings/reaction',
active: props.initialPage === 'reaction', active: currentPage?.route.name === 'reaction',
}, { }, {
icon: 'fas fa-cloud', icon: 'fas fa-cloud',
text: i18n.ts.drive, text: i18n.ts.drive,
to: '/settings/drive', to: '/settings/drive',
active: props.initialPage === 'drive', active: currentPage?.route.name === 'drive',
}, { }, {
icon: 'fas fa-bell', icon: 'fas fa-bell',
text: i18n.ts.notifications, text: i18n.ts.notifications,
to: '/settings/notifications', to: '/settings/notifications',
active: props.initialPage === 'notifications', active: currentPage?.route.name === 'notifications',
}, { }, {
icon: 'fas fa-envelope', icon: 'fas fa-envelope',
text: i18n.ts.email, text: i18n.ts.email,
to: '/settings/email', to: '/settings/email',
active: props.initialPage === 'email', active: currentPage?.route.name === 'email',
}, { }, {
icon: 'fas fa-share-alt', icon: 'fas fa-share-alt',
text: i18n.ts.integration, text: i18n.ts.integration,
to: '/settings/integration', to: '/settings/integration',
active: props.initialPage === 'integration', active: currentPage?.route.name === 'integration',
}, { }, {
icon: 'fas fa-lock', icon: 'fas fa-lock',
text: i18n.ts.security, text: i18n.ts.security,
to: '/settings/security', to: '/settings/security',
active: props.initialPage === 'security', active: currentPage?.route.name === 'security',
}], }],
}, { }, {
title: i18n.ts.clientSettings, title: i18n.ts.clientSettings,
@ -107,32 +104,32 @@ const menuDef = computed(() => [{
icon: 'fas fa-cogs', icon: 'fas fa-cogs',
text: i18n.ts.general, text: i18n.ts.general,
to: '/settings/general', to: '/settings/general',
active: props.initialPage === 'general', active: currentPage?.route.name === 'general',
}, { }, {
icon: 'fas fa-palette', icon: 'fas fa-palette',
text: i18n.ts.theme, text: i18n.ts.theme,
to: '/settings/theme', to: '/settings/theme',
active: props.initialPage === 'theme', active: currentPage?.route.name === 'theme',
}, { }, {
icon: 'fas fa-bars', icon: 'fas fa-bars',
text: i18n.ts.navbar, text: i18n.ts.navbar,
to: '/settings/navbar', to: '/settings/navbar',
active: props.initialPage === 'navbar', active: currentPage?.route.name === 'navbar',
}, { }, {
icon: 'fas fa-bars-progress', icon: 'fas fa-bars-progress',
text: i18n.ts.statusbar, text: i18n.ts.statusbar,
to: '/settings/statusbars', to: '/settings/statusbar',
active: props.initialPage === 'statusbars', active: currentPage?.route.name === 'statusbar',
}, { }, {
icon: 'fas fa-music', icon: 'fas fa-music',
text: i18n.ts.sounds, text: i18n.ts.sounds,
to: '/settings/sounds', to: '/settings/sounds',
active: props.initialPage === 'sounds', active: currentPage?.route.name === 'sounds',
}, { }, {
icon: 'fas fa-plug', icon: 'fas fa-plug',
text: i18n.ts.plugins, text: i18n.ts.plugins,
to: '/settings/plugin', to: '/settings/plugin',
active: props.initialPage === 'plugin', active: currentPage?.route.name === 'plugin',
}], }],
}, { }, {
title: i18n.ts.otherSettings, title: i18n.ts.otherSettings,
@ -140,37 +137,37 @@ const menuDef = computed(() => [{
icon: 'fas fa-boxes', icon: 'fas fa-boxes',
text: i18n.ts.importAndExport, text: i18n.ts.importAndExport,
to: '/settings/import-export', to: '/settings/import-export',
active: props.initialPage === 'import-export', active: currentPage?.route.name === 'import-export',
}, { }, {
icon: 'fas fa-volume-mute', icon: 'fas fa-volume-mute',
text: i18n.ts.instanceMute, text: i18n.ts.instanceMute,
to: '/settings/instance-mute', to: '/settings/instance-mute',
active: props.initialPage === 'instance-mute', active: currentPage?.route.name === 'instance-mute',
}, { }, {
icon: 'fas fa-ban', icon: 'fas fa-ban',
text: i18n.ts.muteAndBlock, text: i18n.ts.muteAndBlock,
to: '/settings/mute-block', to: '/settings/mute-block',
active: props.initialPage === 'mute-block', active: currentPage?.route.name === 'mute-block',
}, { }, {
icon: 'fas fa-comment-slash', icon: 'fas fa-comment-slash',
text: i18n.ts.wordMute, text: i18n.ts.wordMute,
to: '/settings/word-mute', to: '/settings/word-mute',
active: props.initialPage === 'word-mute', active: currentPage?.route.name === 'word-mute',
}, { }, {
icon: 'fas fa-key', icon: 'fas fa-key',
text: 'API', text: 'API',
to: '/settings/api', to: '/settings/api',
active: props.initialPage === 'api', active: currentPage?.route.name === 'api',
}, { }, {
icon: 'fas fa-bolt', icon: 'fas fa-bolt',
text: 'Webhook', text: 'Webhook',
to: '/settings/webhook', to: '/settings/webhook',
active: props.initialPage === 'webhook', active: currentPage?.route.name === 'webhook',
}, { }, {
icon: 'fas fa-ellipsis-h', icon: 'fas fa-ellipsis-h',
text: i18n.ts.other, text: i18n.ts.other,
to: '/settings/other', to: '/settings/other',
active: props.initialPage === 'other', active: currentPage?.route.name === 'other',
}], }],
}, { }, {
items: [{ items: [{
@ -198,77 +195,24 @@ const menuDef = computed(() => [{
}], }],
}]); }]);
const pageProps = ref({}); watch($$(narrow), () => {
const component = computed(() => {
if (props.initialPage == null) return null;
switch (props.initialPage) {
case 'accounts': return defineAsyncComponent(() => import('./accounts.vue'));
case 'profile': return defineAsyncComponent(() => import('./profile.vue'));
case 'privacy': return defineAsyncComponent(() => import('./privacy.vue'));
case 'reaction': return defineAsyncComponent(() => import('./reaction.vue'));
case 'drive': return defineAsyncComponent(() => import('./drive.vue'));
case 'notifications': return defineAsyncComponent(() => import('./notifications.vue'));
case 'mute-block': return defineAsyncComponent(() => import('./mute-block.vue'));
case 'word-mute': return defineAsyncComponent(() => import('./word-mute.vue'));
case 'instance-mute': return defineAsyncComponent(() => import('./instance-mute.vue'));
case 'integration': return defineAsyncComponent(() => import('./integration.vue'));
case 'security': return defineAsyncComponent(() => import('./security.vue'));
case '2fa': return defineAsyncComponent(() => import('./2fa.vue'));
case 'api': return defineAsyncComponent(() => import('./api.vue'));
case 'webhook': return defineAsyncComponent(() => import('./webhook.vue'));
case 'webhook/new': return defineAsyncComponent(() => import('./webhook.new.vue'));
case 'webhook/edit': return defineAsyncComponent(() => import('./webhook.edit.vue'));
case 'apps': return defineAsyncComponent(() => import('./apps.vue'));
case 'other': return defineAsyncComponent(() => import('./other.vue'));
case 'general': return defineAsyncComponent(() => import('./general.vue'));
case 'email': return defineAsyncComponent(() => import('./email.vue'));
case 'theme': return defineAsyncComponent(() => import('./theme.vue'));
case 'theme/install': return defineAsyncComponent(() => import('./theme.install.vue'));
case 'theme/manage': return defineAsyncComponent(() => import('./theme.manage.vue'));
case 'navbar': return defineAsyncComponent(() => import('./navbar.vue'));
case 'statusbars': return defineAsyncComponent(() => import('./statusbars.vue'));
case 'sounds': return defineAsyncComponent(() => import('./sounds.vue'));
case 'custom-css': return defineAsyncComponent(() => import('./custom-css.vue'));
case 'deck': return defineAsyncComponent(() => import('./deck.vue'));
case 'plugin': return defineAsyncComponent(() => import('./plugin.vue'));
case 'plugin/install': return defineAsyncComponent(() => import('./plugin.install.vue'));
case 'import-export': return defineAsyncComponent(() => import('./import-export.vue'));
case 'account-info': return defineAsyncComponent(() => import('./account-info.vue'));
case 'delete-account': return defineAsyncComponent(() => import('./delete-account.vue'));
}
return null;
});
watch(component, () => {
pageProps.value = {};
nextTick(() => {
scroll(el.value, { top: 0 });
});
}, { immediate: true });
watch(() => props.initialPage, () => {
if (props.initialPage == null && !narrow.value) {
router.push('/settings/profile');
} else {
if (props.initialPage == null) {
INFO.value = indexInfo;
}
}
});
watch(narrow, () => {
if (props.initialPage == null && !narrow.value) {
router.push('/settings/profile');
}
}); });
onMounted(() => { onMounted(() => {
ro.observe(el.value); ro.observe(el.value);
narrow.value = el.value.offsetWidth < NARROW_THRESHOLD; narrow = el.value.offsetWidth < NARROW_THRESHOLD;
if (props.initialPage == null && !narrow.value) {
router.push('/settings/profile'); if (!narrow && currentPage?.route.name == null) {
router.replace('/settings/profile');
}
});
onActivated(() => {
narrow = el.value.offsetWidth < NARROW_THRESHOLD;
if (!narrow && currentPage?.route.name == null) {
router.replace('/settings/profile');
} }
}); });

View file

@ -1,12 +1,12 @@
<template> <template>
<div class="_formRoot"> <div class="_formRoot">
<MkTab v-model="tab" style="margin-bottom: var(--margin);"> <MkTab v-model="tab" style="margin-bottom: var(--margin);">
<option value="mute">{{ $ts.mutedUsers }}</option> <option value="mute">{{ i18n.ts.mutedUsers }}</option>
<option value="block">{{ $ts.blockedUsers }}</option> <option value="block">{{ i18n.ts.blockedUsers }}</option>
</MkTab> </MkTab>
<div v-if="tab === 'mute'"> <div v-if="tab === 'mute'">
<MkPagination :pagination="mutingPagination" class="muting"> <MkPagination :pagination="mutingPagination" class="muting">
<template #empty><FormInfo>{{ $ts.noUsers }}</FormInfo></template> <template #empty><FormInfo>{{ i18n.ts.noUsers }}</FormInfo></template>
<template #default="{items}"> <template #default="{items}">
<FormLink v-for="mute in items" :key="mute.id" :to="userPage(mute.mutee)"> <FormLink v-for="mute in items" :key="mute.id" :to="userPage(mute.mutee)">
<MkAcct :user="mute.mutee"/> <MkAcct :user="mute.mutee"/>
@ -16,7 +16,7 @@
</div> </div>
<div v-if="tab === 'block'"> <div v-if="tab === 'block'">
<MkPagination :pagination="blockingPagination" class="blocking"> <MkPagination :pagination="blockingPagination" class="blocking">
<template #empty><FormInfo>{{ $ts.noUsers }}</FormInfo></template> <template #empty><FormInfo>{{ i18n.ts.noUsers }}</FormInfo></template>
<template #default="{items}"> <template #default="{items}">
<FormLink v-for="block in items" :key="block.id" :to="userPage(block.blockee)"> <FormLink v-for="block in items" :key="block.id" :to="userPage(block.blockee)">
<MkAcct :user="block.blockee"/> <MkAcct :user="block.blockee"/>

View file

@ -1,54 +1,54 @@
<template> <template>
<div class="_formRoot"> <div class="_formRoot">
<FormSwitch v-model="isLocked" class="_formBlock" @update:modelValue="save()">{{ $ts.makeFollowManuallyApprove }}<template #caption>{{ $ts.lockedAccountInfo }}</template></FormSwitch> <FormSwitch v-model="isLocked" class="_formBlock" @update:modelValue="save()">{{ i18n.ts.makeFollowManuallyApprove }}<template #caption>{{ i18n.ts.lockedAccountInfo }}</template></FormSwitch>
<FormSwitch v-if="isLocked" v-model="autoAcceptFollowed" class="_formBlock" @update:modelValue="save()">{{ $ts.autoAcceptFollowed }}</FormSwitch> <FormSwitch v-if="isLocked" v-model="autoAcceptFollowed" class="_formBlock" @update:modelValue="save()">{{ i18n.ts.autoAcceptFollowed }}</FormSwitch>
<FormSwitch v-model="publicReactions" class="_formBlock" @update:modelValue="save()"> <FormSwitch v-model="publicReactions" class="_formBlock" @update:modelValue="save()">
{{ $ts.makeReactionsPublic }} {{ i18n.ts.makeReactionsPublic }}
<template #caption>{{ $ts.makeReactionsPublicDescription }}</template> <template #caption>{{ i18n.ts.makeReactionsPublicDescription }}</template>
</FormSwitch> </FormSwitch>
<FormSelect v-model="ffVisibility" class="_formBlock" @update:modelValue="save()"> <FormSelect v-model="ffVisibility" class="_formBlock" @update:modelValue="save()">
<template #label>{{ $ts.ffVisibility }}</template> <template #label>{{ i18n.ts.ffVisibility }}</template>
<option value="public">{{ $ts._ffVisibility.public }}</option> <option value="public">{{ i18n.ts._ffVisibility.public }}</option>
<option value="followers">{{ $ts._ffVisibility.followers }}</option> <option value="followers">{{ i18n.ts._ffVisibility.followers }}</option>
<option value="private">{{ $ts._ffVisibility.private }}</option> <option value="private">{{ i18n.ts._ffVisibility.private }}</option>
<template #caption>{{ $ts.ffVisibilityDescription }}</template> <template #caption>{{ i18n.ts.ffVisibilityDescription }}</template>
</FormSelect> </FormSelect>
<FormSwitch v-model="hideOnlineStatus" class="_formBlock" @update:modelValue="save()"> <FormSwitch v-model="hideOnlineStatus" class="_formBlock" @update:modelValue="save()">
{{ $ts.hideOnlineStatus }} {{ i18n.ts.hideOnlineStatus }}
<template #caption>{{ $ts.hideOnlineStatusDescription }}</template> <template #caption>{{ i18n.ts.hideOnlineStatusDescription }}</template>
</FormSwitch> </FormSwitch>
<FormSwitch v-model="noCrawle" class="_formBlock" @update:modelValue="save()"> <FormSwitch v-model="noCrawle" class="_formBlock" @update:modelValue="save()">
{{ $ts.noCrawle }} {{ i18n.ts.noCrawle }}
<template #caption>{{ $ts.noCrawleDescription }}</template> <template #caption>{{ i18n.ts.noCrawleDescription }}</template>
</FormSwitch> </FormSwitch>
<FormSwitch v-model="isExplorable" class="_formBlock" @update:modelValue="save()"> <FormSwitch v-model="isExplorable" class="_formBlock" @update:modelValue="save()">
{{ $ts.makeExplorable }} {{ i18n.ts.makeExplorable }}
<template #caption>{{ $ts.makeExplorableDescription }}</template> <template #caption>{{ i18n.ts.makeExplorableDescription }}</template>
</FormSwitch> </FormSwitch>
<FormSection> <FormSection>
<FormSwitch v-model="rememberNoteVisibility" class="_formBlock" @update:modelValue="save()">{{ $ts.rememberNoteVisibility }}</FormSwitch> <FormSwitch v-model="rememberNoteVisibility" class="_formBlock" @update:modelValue="save()">{{ i18n.ts.rememberNoteVisibility }}</FormSwitch>
<FormFolder v-if="!rememberNoteVisibility" class="_formBlock"> <FormFolder v-if="!rememberNoteVisibility" class="_formBlock">
<template #label>{{ $ts.defaultNoteVisibility }}</template> <template #label>{{ i18n.ts.defaultNoteVisibility }}</template>
<template v-if="defaultNoteVisibility === 'public'" #suffix>{{ $ts._visibility.public }}</template> <template v-if="defaultNoteVisibility === 'public'" #suffix>{{ i18n.ts._visibility.public }}</template>
<template v-else-if="defaultNoteVisibility === 'home'" #suffix>{{ $ts._visibility.home }}</template> <template v-else-if="defaultNoteVisibility === 'home'" #suffix>{{ i18n.ts._visibility.home }}</template>
<template v-else-if="defaultNoteVisibility === 'followers'" #suffix>{{ $ts._visibility.followers }}</template> <template v-else-if="defaultNoteVisibility === 'followers'" #suffix>{{ i18n.ts._visibility.followers }}</template>
<template v-else-if="defaultNoteVisibility === 'specified'" #suffix>{{ $ts._visibility.specified }}</template> <template v-else-if="defaultNoteVisibility === 'specified'" #suffix>{{ i18n.ts._visibility.specified }}</template>
<FormSelect v-model="defaultNoteVisibility" class="_formBlock"> <FormSelect v-model="defaultNoteVisibility" class="_formBlock">
<option value="public">{{ $ts._visibility.public }}</option> <option value="public">{{ i18n.ts._visibility.public }}</option>
<option value="home">{{ $ts._visibility.home }}</option> <option value="home">{{ i18n.ts._visibility.home }}</option>
<option value="followers">{{ $ts._visibility.followers }}</option> <option value="followers">{{ i18n.ts._visibility.followers }}</option>
<option value="specified">{{ $ts._visibility.specified }}</option> <option value="specified">{{ i18n.ts._visibility.specified }}</option>
</FormSelect> </FormSelect>
<FormSwitch v-model="defaultNoteLocalOnly" class="_formBlock">{{ $ts._visibility.localOnly }}</FormSwitch> <FormSwitch v-model="defaultNoteLocalOnly" class="_formBlock">{{ i18n.ts._visibility.localOnly }}</FormSwitch>
</FormFolder> </FormFolder>
</FormSection> </FormSection>
<FormSwitch v-model="keepCw" class="_formBlock" @update:modelValue="save()">{{ $ts.keepCw }}</FormSwitch> <FormSwitch v-model="keepCw" class="_formBlock" @update:modelValue="save()">{{ i18n.ts.keepCw }}</FormSwitch>
</div> </div>
</template> </template>

View file

@ -1,7 +1,7 @@
<template> <template>
<div class="_formRoot"> <div class="_formRoot">
<FromSlot class="_formBlock"> <FromSlot class="_formBlock">
<template #label>{{ $ts.reactionSettingDescription }}</template> <template #label>{{ i18n.ts.reactionSettingDescription }}</template>
<div v-panel style="border-radius: 6px;"> <div v-panel style="border-radius: 6px;">
<XDraggable v-model="reactions" class="zoaiodol" :item-key="item => item" animation="150" delay="100" delay-on-touch-only="true"> <XDraggable v-model="reactions" class="zoaiodol" :item-key="item => item" animation="150" delay="100" delay-on-touch-only="true">
<template #item="{element}"> <template #item="{element}">
@ -14,17 +14,17 @@
</template> </template>
</XDraggable> </XDraggable>
</div> </div>
<template #caption>{{ $ts.reactionSettingDescription2 }} <button class="_textButton" @click="preview">{{ $ts.preview }}</button></template> <template #caption>{{ i18n.ts.reactionSettingDescription2 }} <button class="_textButton" @click="preview">{{ i18n.ts.preview }}</button></template>
</FromSlot> </FromSlot>
<FormRadios v-model="reactionPickerSize" class="_formBlock"> <FormRadios v-model="reactionPickerSize" class="_formBlock">
<template #label>{{ $ts.size }}</template> <template #label>{{ i18n.ts.size }}</template>
<option :value="1">{{ $ts.small }}</option> <option :value="1">{{ i18n.ts.small }}</option>
<option :value="2">{{ $ts.medium }}</option> <option :value="2">{{ i18n.ts.medium }}</option>
<option :value="3">{{ $ts.large }}</option> <option :value="3">{{ i18n.ts.large }}</option>
</FormRadios> </FormRadios>
<FormRadios v-model="reactionPickerWidth" class="_formBlock"> <FormRadios v-model="reactionPickerWidth" class="_formBlock">
<template #label>{{ $ts.numberOfColumn }}</template> <template #label>{{ i18n.ts.numberOfColumn }}</template>
<option :value="1">5</option> <option :value="1">5</option>
<option :value="2">6</option> <option :value="2">6</option>
<option :value="3">7</option> <option :value="3">7</option>
@ -32,22 +32,22 @@
<option :value="5">9</option> <option :value="5">9</option>
</FormRadios> </FormRadios>
<FormRadios v-model="reactionPickerHeight" class="_formBlock"> <FormRadios v-model="reactionPickerHeight" class="_formBlock">
<template #label>{{ $ts.height }}</template> <template #label>{{ i18n.ts.height }}</template>
<option :value="1">{{ $ts.small }}</option> <option :value="1">{{ i18n.ts.small }}</option>
<option :value="2">{{ $ts.medium }}</option> <option :value="2">{{ i18n.ts.medium }}</option>
<option :value="3">{{ $ts.large }}</option> <option :value="3">{{ i18n.ts.large }}</option>
<option :value="4">{{ $ts.large }}+</option> <option :value="4">{{ i18n.ts.large }}+</option>
</FormRadios> </FormRadios>
<FormSwitch v-model="reactionPickerUseDrawerForMobile" class="_formBlock"> <FormSwitch v-model="reactionPickerUseDrawerForMobile" class="_formBlock">
{{ $ts.useDrawerReactionPickerForMobile }} {{ i18n.ts.useDrawerReactionPickerForMobile }}
<template #caption>{{ $ts.needReloadToApply }}</template> <template #caption>{{ i18n.ts.needReloadToApply }}</template>
</FormSwitch> </FormSwitch>
<FormSection> <FormSection>
<div style="display: flex; gap: var(--margin); flex-wrap: wrap;"> <div style="display: flex; gap: var(--margin); flex-wrap: wrap;">
<FormButton inline @click="preview"><i class="fas fa-eye"></i> {{ $ts.preview }}</FormButton> <FormButton inline @click="preview"><i class="fas fa-eye"></i> {{ i18n.ts.preview }}</FormButton>
<FormButton inline danger @click="setDefault"><i class="fas fa-undo"></i> {{ $ts.default }}</FormButton> <FormButton inline danger @click="setDefault"><i class="fas fa-undo"></i> {{ i18n.ts.default }}</FormButton>
</div> </div>
</FormSection> </FormSection>
</div> </div>

View file

@ -12,7 +12,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed, onMounted, ref, watch } from 'vue'; import { computed, onMounted, ref, watch } from 'vue';
import { v4 as uuid } from 'uuid'; import { v4 as uuid } from 'uuid';
import XStatusbar from './statusbars.statusbar.vue'; import XStatusbar from './statusbar.statusbar.vue';
import FormRadios from '@/components/form/radios.vue'; import FormRadios from '@/components/form/radios.vue';
import FormFolder from '@/components/form/folder.vue'; import FormFolder from '@/components/form/folder.vue';
import FormButton from '@/components/ui/button.vue'; import FormButton from '@/components/ui/button.vue';

View file

@ -5,8 +5,8 @@
<div class="toggleWrapper"> <div class="toggleWrapper">
<input id="dn" v-model="darkMode" type="checkbox" class="dn"/> <input id="dn" v-model="darkMode" type="checkbox" class="dn"/>
<label for="dn" class="toggle"> <label for="dn" class="toggle">
<span class="before">{{ $ts.light }}</span> <span class="before">{{ i18n.ts.light }}</span>
<span class="after">{{ $ts.dark }}</span> <span class="after">{{ i18n.ts.dark }}</span>
<span class="toggle__handler"> <span class="toggle__handler">
<span class="crater crater--1"></span> <span class="crater crater--1"></span>
<span class="crater crater--2"></span> <span class="crater crater--2"></span>
@ -22,44 +22,46 @@
</div> </div>
</div> </div>
<div class="sync"> <div class="sync">
<FormSwitch v-model="syncDeviceDarkMode">{{ $ts.syncDeviceDarkMode }}</FormSwitch> <FormSwitch v-model="syncDeviceDarkMode">{{ i18n.ts.syncDeviceDarkMode }}</FormSwitch>
</div> </div>
</div> </div>
<div class="selects _formBlock"> <div class="selects _formBlock">
<FormSelect v-model="lightThemeId" large class="select"> <FormSelect v-model="lightThemeId" large class="select">
<template #label>{{ $ts.themeForLightMode }}</template> <template #label>{{ i18n.ts.themeForLightMode }}</template>
<template #prefix><i class="fas fa-sun"></i></template> <template #prefix><i class="fas fa-sun"></i></template>
<optgroup :label="$ts.lightThemes"> <option v-if="instanceLightTheme" :key="'instance:' + instanceLightTheme.id" :value="instanceLightTheme.id">{{ instanceLightTheme.name }}</option>
<option v-for="x in lightThemes" :key="x.id" :value="x.id">{{ x.name }}</option> <optgroup v-if="installedLightThemes.length > 0" :label="i18n.ts._theme.installedThemes">
<option v-for="x in installedLightThemes" :key="'installed:' + x.id" :value="x.id">{{ x.name }}</option>
</optgroup> </optgroup>
<optgroup :label="$ts.darkThemes"> <optgroup :label="i18n.ts._theme.builtinThemes">
<option v-for="x in darkThemes" :key="x.id" :value="x.id">{{ x.name }}</option> <option v-for="x in builtinLightThemes" :key="'builtin:' + x.id" :value="x.id">{{ x.name }}</option>
</optgroup> </optgroup>
</FormSelect> </FormSelect>
<FormSelect v-model="darkThemeId" large class="select"> <FormSelect v-model="darkThemeId" large class="select">
<template #label>{{ $ts.themeForDarkMode }}</template> <template #label>{{ i18n.ts.themeForDarkMode }}</template>
<template #prefix><i class="fas fa-moon"></i></template> <template #prefix><i class="fas fa-moon"></i></template>
<optgroup :label="$ts.darkThemes"> <option v-if="instanceDarkTheme" :key="'instance:' + instanceDarkTheme.id" :value="instanceDarkTheme.id">{{ instanceDarkTheme.name }}</option>
<option v-for="x in darkThemes" :key="x.id" :value="x.id">{{ x.name }}</option> <optgroup v-if="installedDarkThemes.length > 0" :label="i18n.ts._theme.installedThemes">
<option v-for="x in installedDarkThemes" :key="'installed:' + x.id" :value="x.id">{{ x.name }}</option>
</optgroup> </optgroup>
<optgroup :label="$ts.lightThemes"> <optgroup :label="i18n.ts._theme.builtinThemes">
<option v-for="x in lightThemes" :key="x.id" :value="x.id">{{ x.name }}</option> <option v-for="x in builtinDarkThemes" :key="'builtin:' + x.id" :value="x.id">{{ x.name }}</option>
</optgroup> </optgroup>
</FormSelect> </FormSelect>
</div> </div>
<FormSection> <FormSection>
<div class="_formLinksGrid"> <div class="_formLinksGrid">
<FormLink to="/settings/theme/manage"><template #icon><i class="fas fa-folder-open"></i></template>{{ $ts._theme.manage }}<template #suffix>{{ themesCount }}</template></FormLink> <FormLink to="/settings/theme/manage"><template #icon><i class="fas fa-folder-open"></i></template>{{ i18n.ts._theme.manage }}<template #suffix>{{ themesCount }}</template></FormLink>
<FormLink to="https://assets.misskey.io/theme/list" external><template #icon><i class="fas fa-globe"></i></template>{{ $ts._theme.explore }}</FormLink> <FormLink to="https://assets.misskey.io/theme/list" external><template #icon><i class="fas fa-globe"></i></template>{{ i18n.ts._theme.explore }}</FormLink>
<FormLink to="/settings/theme/install"><template #icon><i class="fas fa-download"></i></template>{{ $ts._theme.install }}</FormLink> <FormLink to="/settings/theme/install"><template #icon><i class="fas fa-download"></i></template>{{ i18n.ts._theme.install }}</FormLink>
<FormLink to="/theme-editor"><template #icon><i class="fas fa-paint-roller"></i></template>{{ $ts._theme.make }}</FormLink> <FormLink to="/theme-editor"><template #icon><i class="fas fa-paint-roller"></i></template>{{ i18n.ts._theme.make }}</FormLink>
</div> </div>
</FormSection> </FormSection>
<FormButton v-if="wallpaper == null" class="_formBlock" @click="setWallpaper">{{ $ts.setWallpaper }}</FormButton> <FormButton v-if="wallpaper == null" class="_formBlock" @click="setWallpaper">{{ i18n.ts.setWallpaper }}</FormButton>
<FormButton v-else class="_formBlock" @click="wallpaper = null">{{ $ts.removeWallpaper }}</FormButton> <FormButton v-else class="_formBlock" @click="wallpaper = null">{{ i18n.ts.removeWallpaper }}</FormButton>
</div> </div>
</template> </template>
@ -83,14 +85,15 @@ import { definePageMetadata } from '@/scripts/page-metadata';
const installedThemes = ref(getThemes()); const installedThemes = ref(getThemes());
const builtinThemes = getBuiltinThemesRef(); const builtinThemes = getBuiltinThemesRef();
const instanceThemes = [];
if (instance.defaultLightTheme != null) instanceThemes.push(JSON5.parse(instance.defaultLightTheme)); const instanceDarkTheme = computed(() => instance.defaultDarkTheme ? JSON5.parse(instance.defaultDarkTheme) : null);
if (instance.defaultDarkTheme != null) instanceThemes.push(JSON5.parse(instance.defaultDarkTheme)); const installedDarkThemes = computed(() => installedThemes.value.filter(t => t.base === 'dark' || t.kind === 'dark'));
const builtinDarkThemes = computed(() => builtinThemes.value.filter(t => t.base === 'dark' || t.kind === 'dark'));
const instanceLightTheme = computed(() => instance.defaultLightTheme ? JSON5.parse(instance.defaultLightTheme) : null);
const installedLightThemes = computed(() => installedThemes.value.filter(t => t.base === 'light' || t.kind === 'light'));
const builtinLightThemes = computed(() => builtinThemes.value.filter(t => t.base === 'light' || t.kind === 'light'));
const themes = computed(() => uniqueBy([ instanceDarkTheme.value, instanceLightTheme.value, ...builtinThemes.value, ...installedThemes.value ].filter(x => x != null), theme => theme.id));
const themes = computed(() => uniqueBy([ ...instanceThemes, ...builtinThemes.value, ...installedThemes.value ], theme => theme.id));
const darkThemes = computed(() => themes.value.filter(t => t.base === 'dark' || t.kind === 'dark'));
const lightThemes = computed(() => themes.value.filter(t => t.base === 'light' || t.kind === 'light'));
const darkTheme = ColdDeviceStorage.ref('darkTheme'); const darkTheme = ColdDeviceStorage.ref('darkTheme');
const darkThemeId = computed({ const darkThemeId = computed({
get() { get() {

View file

@ -43,8 +43,12 @@ import * as os from '@/os';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
const props = defineProps<{
webhookId: string;
}>();
const webhook = await os.api('i/webhooks/show', { const webhook = await os.api('i/webhooks/show', {
webhookId: new URLSearchParams(window.location.search).get('id'), webhookId: props.webhookId,
}); });
let name = $ref(webhook.name); let name = $ref(webhook.name);

View file

@ -9,7 +9,7 @@
<FormSection> <FormSection>
<MkPagination :pagination="pagination"> <MkPagination :pagination="pagination">
<template #default="{items}"> <template #default="{items}">
<FormLink v-for="webhook in items" :key="webhook.id" :to="`/settings/webhook/edit?id=${webhook.id}`" class="_formBlock"> <FormLink v-for="webhook in items" :key="webhook.id" :to="`/settings/webhook/edit/${webhook.id}`" class="_formBlock">
<template #icon> <template #icon>
<i v-if="webhook.active === false" class="fas fa-circle-pause"></i> <i v-if="webhook.active === false" class="fas fa-circle-pause"></i>
<i v-else-if="webhook.latestStatus === null" class="far fa-circle"></i> <i v-else-if="webhook.latestStatus === null" class="far fa-circle"></i>

View file

@ -16,7 +16,7 @@
class="_panel" class="_panel"
@posted="state = 'posted'" @posted="state = 'posted'"
/> />
<MkButton v-else-if="state === 'posted'" primary class="close" @click="close()">{{ $ts.close }}</MkButton> <MkButton v-else-if="state === 'posted'" primary class="close" @click="close()">{{ i18n.ts.close }}</MkButton>
</div> </div>
</section> </section>
</div> </div>
@ -25,7 +25,7 @@
<script lang="ts" setup> <script lang="ts" setup>
// SPECIFICATION: https://misskey-hub.net/docs/features/share-form.html // SPECIFICATION: https://misskey-hub.net/docs/features/share-form.html
import { defineComponent } from 'vue'; import { } from 'vue';
import { noteVisibilities } from 'misskey-js'; import { noteVisibilities } from 'misskey-js';
import * as Acct from 'misskey-js/built/acct'; import * as Acct from 'misskey-js/built/acct';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';

View file

@ -1,52 +1,52 @@
<template> <template>
<div class="_card tbkwesmv"> <div class="_card tbkwesmv">
<div class="_title"><i class="fas fa-info-circle"></i> {{ $ts._tutorial.title }}</div> <div class="_title"><i class="fas fa-info-circle"></i> {{ i18n.ts._tutorial.title }}</div>
<div v-if="tutorial === 0" class="_content"> <div v-if="tutorial === 0" class="_content">
<div>{{ $ts._tutorial.step1_1 }}</div> <div>{{ i18n.ts._tutorial.step1_1 }}</div>
<div>{{ $ts._tutorial.step1_2 }}</div> <div>{{ i18n.ts._tutorial.step1_2 }}</div>
<div>{{ $ts._tutorial.step1_3 }}</div> <div>{{ i18n.ts._tutorial.step1_3 }}</div>
</div> </div>
<div v-else-if="tutorial === 1" class="_content"> <div v-else-if="tutorial === 1" class="_content">
<div>{{ $ts._tutorial.step2_1 }}</div> <div>{{ i18n.ts._tutorial.step2_1 }}</div>
<div>{{ $ts._tutorial.step2_2 }}</div> <div>{{ i18n.ts._tutorial.step2_2 }}</div>
<MkA class="_link" to="/settings/profile">{{ $ts.editProfile }}</MkA> <MkA class="_link" to="/settings/profile">{{ i18n.ts.editProfile }}</MkA>
</div> </div>
<div v-else-if="tutorial === 2" class="_content"> <div v-else-if="tutorial === 2" class="_content">
<div>{{ $ts._tutorial.step3_1 }}</div> <div>{{ i18n.ts._tutorial.step3_1 }}</div>
<div>{{ $ts._tutorial.step3_2 }}</div> <div>{{ i18n.ts._tutorial.step3_2 }}</div>
<div>{{ $ts._tutorial.step3_3 }}</div> <div>{{ i18n.ts._tutorial.step3_3 }}</div>
<small>{{ $ts._tutorial.step3_4 }}</small> <small>{{ i18n.ts._tutorial.step3_4 }}</small>
</div> </div>
<div v-else-if="tutorial === 3" class="_content"> <div v-else-if="tutorial === 3" class="_content">
<div>{{ $ts._tutorial.step4_1 }}</div> <div>{{ i18n.ts._tutorial.step4_1 }}</div>
<div>{{ $ts._tutorial.step4_2 }}</div> <div>{{ i18n.ts._tutorial.step4_2 }}</div>
</div> </div>
<div v-else-if="tutorial === 4" class="_content"> <div v-else-if="tutorial === 4" class="_content">
<div>{{ $ts._tutorial.step5_1 }}</div> <div>{{ i18n.ts._tutorial.step5_1 }}</div>
<I18n :src="$ts._tutorial.step5_2" tag="div"> <I18n :src="i18n.ts._tutorial.step5_2" tag="div">
<template #featured> <template #featured>
<MkA class="_link" to="/featured">{{ $ts.featured }}</MkA> <MkA class="_link" to="/featured">{{ i18n.ts.featured }}</MkA>
</template> </template>
<template #explore> <template #explore>
<MkA class="_link" to="/explore">{{ $ts.explore }}</MkA> <MkA class="_link" to="/explore">{{ i18n.ts.explore }}</MkA>
</template> </template>
</I18n> </I18n>
<div>{{ $ts._tutorial.step5_3 }}</div> <div>{{ i18n.ts._tutorial.step5_3 }}</div>
<small>{{ $ts._tutorial.step5_4 }}</small> <small>{{ i18n.ts._tutorial.step5_4 }}</small>
</div> </div>
<div v-else-if="tutorial === 5" class="_content"> <div v-else-if="tutorial === 5" class="_content">
<div>{{ $ts._tutorial.step6_1 }}</div> <div>{{ i18n.ts._tutorial.step6_1 }}</div>
<div>{{ $ts._tutorial.step6_2 }}</div> <div>{{ i18n.ts._tutorial.step6_2 }}</div>
<div>{{ $ts._tutorial.step6_3 }}</div> <div>{{ i18n.ts._tutorial.step6_3 }}</div>
</div> </div>
<div v-else-if="tutorial === 6" class="_content"> <div v-else-if="tutorial === 6" class="_content">
<div>{{ $ts._tutorial.step7_1 }}</div> <div>{{ i18n.ts._tutorial.step7_1 }}</div>
<I18n :src="$ts._tutorial.step7_2" tag="div"> <I18n :src="i18n.ts._tutorial.step7_2" tag="div">
<template #help> <template #help>
<a href="https://misskey-hub.net/help.html" target="_blank" class="_link">{{ $ts.help }}</a> <a href="https://misskey-hub.net/help.html" target="_blank" class="_link">{{ i18n.ts.help }}</a>
</template> </template>
</I18n> </I18n>
<div>{{ $ts._tutorial.step7_3 }}</div> <div>{{ i18n.ts._tutorial.step7_3 }}</div>
</div> </div>
<div class="_footer navigation"> <div class="_footer navigation">
@ -59,8 +59,8 @@
<i class="fas fa-chevron-right"></i> <i class="fas fa-chevron-right"></i>
</button> </button>
</div> </div>
<MkButton v-if="tutorial === 6" class="ok" primary @click="tutorial = -1"><i class="fas fa-check"></i> {{ $ts.gotIt }}</MkButton> <MkButton v-if="tutorial === 6" class="ok" primary @click="tutorial = -1"><i class="fas fa-check"></i> {{ i18n.ts.gotIt }}</MkButton>
<MkButton v-else class="ok" primary @click="tutorial++"><i class="fas fa-check"></i> {{ $ts.next }}</MkButton> <MkButton v-else class="ok" primary @click="tutorial++"><i class="fas fa-check"></i> {{ i18n.ts.next }}</MkButton>
</div> </div>
</div> </div>
</template> </template>
@ -69,10 +69,11 @@
import { computed } from 'vue'; import { computed } from 'vue';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { i18n } from '@/i18n';
const tutorial = computed({ const tutorial = computed({
get() { return defaultStore.reactiveState.tutorial.value || 0; }, get() { return defaultStore.reactiveState.tutorial.value || 0; },
set(value) { defaultStore.set('tutorial', value); } set(value) { defaultStore.set('tutorial', value); },
}); });
</script> </script>

View file

@ -6,7 +6,7 @@
<XTutorial v-if="$i && $store.reactiveState.tutorial.value != -1" class="tutorial _block"/> <XTutorial v-if="$i && $store.reactiveState.tutorial.value != -1" class="tutorial _block"/>
<XPostForm v-if="$store.reactiveState.showFixedPostForm.value" class="post-form _block" fixed/> <XPostForm v-if="$store.reactiveState.showFixedPostForm.value" class="post-form _block" fixed/>
<div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> <div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
<div class="tl _block"> <div class="tl _block">
<XTimeline <XTimeline
ref="tl" :key="src" ref="tl" :key="src"

View file

@ -57,15 +57,15 @@
<div class="_formBlock"> <div class="_formBlock">
<MkKeyValue v-if="user.host" oneline style="margin: 1em 0;"> <MkKeyValue v-if="user.host" oneline style="margin: 1em 0;">
<template #key>{{ $ts.instanceInfo }}</template> <template #key>{{ i18n.ts.instanceInfo }}</template>
<template #value><MkA :to="`/instance-info/${user.host}`" class="_link">{{ user.host }} <i class="fas fa-angle-right"></i></MkA></template> <template #value><MkA :to="`/instance-info/${user.host}`" class="_link">{{ user.host }} <i class="fas fa-angle-right"></i></MkA></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue v-else oneline style="margin: 1em 0;"> <MkKeyValue v-else oneline style="margin: 1em 0;">
<template #key>{{ $ts.instanceInfo }}</template> <template #key>{{ i18n.ts.instanceInfo }}</template>
<template #value>(Local user)</template> <template #value>(Local user)</template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue oneline style="margin: 1em 0;"> <MkKeyValue oneline style="margin: 1em 0;">
<template #key>{{ $ts.updatedAt }}</template> <template #key>{{ i18n.ts.updatedAt }}</template>
<template #value><MkTime v-if="user.lastFetchedAt" mode="detail" :time="user.lastFetchedAt"/><span v-else>N/A</span></template> <template #value><MkTime v-if="user.lastFetchedAt" mode="detail" :time="user.lastFetchedAt"/><span v-else>N/A</span></template>
</MkKeyValue> </MkKeyValue>
<MkKeyValue v-if="ap" oneline style="margin: 1em 0;"> <MkKeyValue v-if="ap" oneline style="margin: 1em 0;">
@ -74,7 +74,7 @@
</MkKeyValue> </MkKeyValue>
</div> </div>
<FormButton v-if="user.host != null" class="_formBlock" @click="updateRemoteUser"><i class="fas fa-sync"></i> {{ $ts.updateRemoteUser }}</FormButton> <FormButton v-if="user.host != null" class="_formBlock" @click="updateRemoteUser"><i class="fas fa-sync"></i> {{ i18n.ts.updateRemoteUser }}</FormButton>
<FormFolder class="_formBlock"> <FormFolder class="_formBlock">
<template #label>Raw</template> <template #label>Raw</template>
@ -85,13 +85,13 @@
</FormSection> </FormSection>
</div> </div>
<div v-else-if="tab === 'moderation'" class="_formRoot"> <div v-else-if="tab === 'moderation'" class="_formRoot">
<FormSwitch v-if="user.host == null && $i.isAdmin && (moderator || !user.isAdmin)" v-model="moderator" class="_formBlock" @update:modelValue="toggleModerator">{{ $ts.moderator }}</FormSwitch> <FormSwitch v-if="user.host == null && $i.isAdmin && (moderator || !user.isAdmin)" v-model="moderator" class="_formBlock" @update:modelValue="toggleModerator">{{ i18n.ts.moderator }}</FormSwitch>
<FormSwitch v-model="silenced" class="_formBlock" @update:modelValue="toggleSilence">{{ $ts.silence }}</FormSwitch> <FormSwitch v-model="silenced" class="_formBlock" @update:modelValue="toggleSilence">{{ i18n.ts.silence }}</FormSwitch>
<FormSwitch v-model="suspended" class="_formBlock" @update:modelValue="toggleSuspend">{{ $ts.suspend }}</FormSwitch> <FormSwitch v-model="suspended" class="_formBlock" @update:modelValue="toggleSuspend">{{ i18n.ts.suspend }}</FormSwitch>
{{ $ts.reflectMayTakeTime }} {{ i18n.ts.reflectMayTakeTime }}
<div class="_formBlock"> <div class="_formBlock">
<FormButton v-if="user.host == null && iAmModerator" inline style="margin-right: 8px;" @click="resetPassword"><i class="fas fa-key"></i> {{ $ts.resetPassword }}</FormButton> <FormButton v-if="user.host == null && iAmModerator" inline style="margin-right: 8px;" @click="resetPassword"><i class="fas fa-key"></i> {{ i18n.ts.resetPassword }}</FormButton>
<FormButton v-if="$i.isAdmin" inline danger @click="deleteAccount">{{ $ts.deleteAccount }}</FormButton> <FormButton v-if="$i.isAdmin" inline danger @click="deleteAccount">{{ i18n.ts.deleteAccount }}</FormButton>
</div> </div>
<FormTextarea v-model="moderationNote" manual-save class="_formBlock"> <FormTextarea v-model="moderationNote" manual-save class="_formBlock">
<template #label>Moderation note</template> <template #label>Moderation note</template>
@ -128,7 +128,7 @@
<div class="cmhjzshm"> <div class="cmhjzshm">
<div class="selects"> <div class="selects">
<MkSelect v-model="chartSrc" style="margin: 0 10px 0 0; flex: 1;"> <MkSelect v-model="chartSrc" style="margin: 0 10px 0 0; flex: 1;">
<option value="per-user-notes">{{ $ts.notes }}</option> <option value="per-user-notes">{{ i18n.ts.notes }}</option>
</MkSelect> </MkSelect>
</div> </div>
<div class="charts"> <div class="charts">

View file

@ -2,7 +2,7 @@
<MkStickyContainer> <MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<div ref="rootEl" v-size="{ min: [800] }" class="eqqrhokj"> <div ref="rootEl" v-size="{ min: [800] }" class="eqqrhokj">
<div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> <div v-if="queue > 0" class="new"><button class="_buttonPrimary" @click="top()">{{ i18n.ts.newNoteRecived }}</button></div>
<div class="tl _block"> <div class="tl _block">
<XTimeline <XTimeline
ref="tlEl" :key="listId" ref="tlEl" :key="listId"

View file

@ -3,8 +3,8 @@
<div ref="rootEl" v-size="{ max: [500] }" class="ftskorzw" :class="{ wide: !narrow }"> <div ref="rootEl" v-size="{ max: [500] }" class="ftskorzw" :class="{ wide: !narrow }">
<div class="main"> <div class="main">
<!-- TODO --> <!-- TODO -->
<!-- <div class="punished" v-if="user.isSuspended"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i> {{ $ts.userSuspended }}</div> --> <!-- <div class="punished" v-if="user.isSuspended"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i> {{ i18n.ts.userSuspended }}</div> -->
<!-- <div class="punished" v-if="user.isSilenced"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i> {{ $ts.userSilenced }}</div> --> <!-- <div class="punished" v-if="user.isSilenced"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i> {{ i18n.ts.userSilenced }}</div> -->
<div class="profile"> <div class="profile">
<MkRemoteCaution v-if="user.host != null" :href="user.url" class="warn"/> <MkRemoteCaution v-if="user.host != null" :href="user.url" class="warn"/>
@ -17,13 +17,13 @@
<MkUserName class="name" :user="user" :nowrap="true"/> <MkUserName class="name" :user="user" :nowrap="true"/>
<div class="bottom"> <div class="bottom">
<span class="username"><MkAcct :user="user" :detail="true"/></span> <span class="username"><MkAcct :user="user" :detail="true"/></span>
<span v-if="user.isAdmin" :title="$ts.isAdmin" style="color: var(--badge);"><i class="fas fa-bookmark"></i></span> <span v-if="user.isAdmin" :title="i18n.ts.isAdmin" style="color: var(--badge);"><i class="fas fa-bookmark"></i></span>
<span v-if="!user.isAdmin && user.isModerator" :title="$ts.isModerator" style="color: var(--badge);"><i class="far fa-bookmark"></i></span> <span v-if="!user.isAdmin && user.isModerator" :title="i18n.ts.isModerator" style="color: var(--badge);"><i class="far fa-bookmark"></i></span>
<span v-if="user.isLocked" :title="$ts.isLocked"><i class="fas fa-lock"></i></span> <span v-if="user.isLocked" :title="i18n.ts.isLocked"><i class="fas fa-lock"></i></span>
<span v-if="user.isBot" :title="$ts.isBot"><i class="fas fa-robot"></i></span> <span v-if="user.isBot" :title="i18n.ts.isBot"><i class="fas fa-robot"></i></span>
</div> </div>
</div> </div>
<span v-if="$i && $i.id != user.id && user.isFollowed" class="followed">{{ $ts.followsYou }}</span> <span v-if="$i && $i.id != user.id && user.isFollowed" class="followed">{{ i18n.ts.followsYou }}</span>
<div v-if="$i" class="actions"> <div v-if="$i" class="actions">
<button class="menu _button" @click="menu"><i class="fas fa-ellipsis-h"></i></button> <button class="menu _button" @click="menu"><i class="fas fa-ellipsis-h"></i></button>
<MkFollowButton v-if="$i.id != user.id" :user="user" :inline="true" :transparent="false" :full="true" class="koudoku"/> <MkFollowButton v-if="$i.id != user.id" :user="user" :inline="true" :transparent="false" :full="true" class="koudoku"/>
@ -34,27 +34,27 @@
<MkUserName :user="user" :nowrap="false" class="name"/> <MkUserName :user="user" :nowrap="false" class="name"/>
<div class="bottom"> <div class="bottom">
<span class="username"><MkAcct :user="user" :detail="true"/></span> <span class="username"><MkAcct :user="user" :detail="true"/></span>
<span v-if="user.isAdmin" :title="$ts.isAdmin" style="color: var(--badge);"><i class="fas fa-bookmark"></i></span> <span v-if="user.isAdmin" :title="i18n.ts.isAdmin" style="color: var(--badge);"><i class="fas fa-bookmark"></i></span>
<span v-if="!user.isAdmin && user.isModerator" :title="$ts.isModerator" style="color: var(--badge);"><i class="far fa-bookmark"></i></span> <span v-if="!user.isAdmin && user.isModerator" :title="i18n.ts.isModerator" style="color: var(--badge);"><i class="far fa-bookmark"></i></span>
<span v-if="user.isLocked" :title="$ts.isLocked"><i class="fas fa-lock"></i></span> <span v-if="user.isLocked" :title="i18n.ts.isLocked"><i class="fas fa-lock"></i></span>
<span v-if="user.isBot" :title="$ts.isBot"><i class="fas fa-robot"></i></span> <span v-if="user.isBot" :title="i18n.ts.isBot"><i class="fas fa-robot"></i></span>
</div> </div>
</div> </div>
<div class="description"> <div class="description">
<Mfm v-if="user.description" :text="user.description" :is-note="false" :author="user" :i="$i" :custom-emojis="user.emojis"/> <Mfm v-if="user.description" :text="user.description" :is-note="false" :author="user" :i="$i" :custom-emojis="user.emojis"/>
<p v-else class="empty">{{ $ts.noAccountDescription }}</p> <p v-else class="empty">{{ i18n.ts.noAccountDescription }}</p>
</div> </div>
<div class="fields system"> <div class="fields system">
<dl v-if="user.location" class="field"> <dl v-if="user.location" class="field">
<dt class="name"><i class="fas fa-map-marker fa-fw"></i> {{ $ts.location }}</dt> <dt class="name"><i class="fas fa-map-marker fa-fw"></i> {{ i18n.ts.location }}</dt>
<dd class="value">{{ user.location }}</dd> <dd class="value">{{ user.location }}</dd>
</dl> </dl>
<dl v-if="user.birthday" class="field"> <dl v-if="user.birthday" class="field">
<dt class="name"><i class="fas fa-birthday-cake fa-fw"></i> {{ $ts.birthday }}</dt> <dt class="name"><i class="fas fa-birthday-cake fa-fw"></i> {{ i18n.ts.birthday }}</dt>
<dd class="value">{{ user.birthday.replace('-', '/').replace('-', '/') }} ({{ $t('yearsOld', { age }) }})</dd> <dd class="value">{{ user.birthday.replace('-', '/').replace('-', '/') }} ({{ $t('yearsOld', { age }) }})</dd>
</dl> </dl>
<dl class="field"> <dl class="field">
<dt class="name"><i class="fas fa-calendar-alt fa-fw"></i> {{ $ts.registeredDate }}</dt> <dt class="name"><i class="fas fa-calendar-alt fa-fw"></i> {{ i18n.ts.registeredDate }}</dt>
<dd class="value">{{ new Date(user.createdAt).toLocaleString() }} (<MkTime :time="user.createdAt"/>)</dd> <dd class="value">{{ new Date(user.createdAt).toLocaleString() }} (<MkTime :time="user.createdAt"/>)</dd>
</dl> </dl>
</div> </div>
@ -71,15 +71,15 @@
<div class="status"> <div class="status">
<MkA v-click-anime :to="userPage(user)" :class="{ active: page === 'index' }"> <MkA v-click-anime :to="userPage(user)" :class="{ active: page === 'index' }">
<b>{{ number(user.notesCount) }}</b> <b>{{ number(user.notesCount) }}</b>
<span>{{ $ts.notes }}</span> <span>{{ i18n.ts.notes }}</span>
</MkA> </MkA>
<MkA v-click-anime :to="userPage(user, 'following')" :class="{ active: page === 'following' }"> <MkA v-click-anime :to="userPage(user, 'following')" :class="{ active: page === 'following' }">
<b>{{ number(user.followingCount) }}</b> <b>{{ number(user.followingCount) }}</b>
<span>{{ $ts.following }}</span> <span>{{ i18n.ts.following }}</span>
</MkA> </MkA>
<MkA v-click-anime :to="userPage(user, 'followers')" :class="{ active: page === 'followers' }"> <MkA v-click-anime :to="userPage(user, 'followers')" :class="{ active: page === 'followers' }">
<b>{{ number(user.followersCount) }}</b> <b>{{ number(user.followersCount) }}</b>
<span>{{ $ts.followers }}</span> <span>{{ i18n.ts.followers }}</span>
</MkA> </MkA>
</div> </div>
</div> </div>
@ -89,7 +89,7 @@
<div v-if="user.pinnedNotes.length > 0" class="_gap"> <div v-if="user.pinnedNotes.length > 0" class="_gap">
<XNote v-for="note in user.pinnedNotes" :key="note.id" class="note _block" :note="note" :pinned="true"/> <XNote v-for="note in user.pinnedNotes" :key="note.id" class="note _block" :note="note" :pinned="true"/>
</div> </div>
<MkInfo v-else-if="$i && $i.id === user.id">{{ $ts.userPagePinTip }}</MkInfo> <MkInfo v-else-if="$i && $i.id === user.id">{{ i18n.ts.userPagePinTip }}</MkInfo>
<template v-if="narrow"> <template v-if="narrow">
<XPhotos :key="user.id" :user="user"/> <XPhotos :key="user.id" :user="user"/>
<XActivity :key="user.id" :user="user" style="margin-top: var(--margin);"/> <XActivity :key="user.id" :user="user" style="margin-top: var(--margin);"/>

View file

@ -2,9 +2,9 @@
<MkStickyContainer> <MkStickyContainer>
<template #header> <template #header>
<MkTab v-model="include" :class="$style.tab"> <MkTab v-model="include" :class="$style.tab">
<option :value="null">{{ $ts.notes }}</option> <option :value="null">{{ i18n.ts.notes }}</option>
<option value="replies">{{ $ts.notesAndReplies }}</option> <option value="replies">{{ i18n.ts.notesAndReplies }}</option>
<option value="files">{{ $ts.withFiles }}</option> <option value="files">{{ i18n.ts.withFiles }}</option>
</MkTab> </MkTab>
</template> </template>
<XNotes :no-gap="true" :pagination="pagination"/> <XNotes :no-gap="true" :pagination="pagination"/>
@ -17,6 +17,7 @@ import * as misskey from 'misskey-js';
import XNotes from '@/components/notes.vue'; import XNotes from '@/components/notes.vue';
import MkTab from '@/components/tab.vue'; import MkTab from '@/components/tab.vue';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n';
const props = defineProps<{ const props = defineProps<{
user: misskey.entities.UserDetailed; user: misskey.entities.UserDetailed;

View file

@ -42,9 +42,117 @@ export const routes = [{
component: page(() => import('./pages/instance-info.vue')), component: page(() => import('./pages/instance-info.vue')),
}, { }, {
name: 'settings', name: 'settings',
path: '/settings/:initialPage(*)?', path: '/settings',
component: page(() => import('./pages/settings/index.vue')), component: page(() => import('./pages/settings/index.vue')),
loginRequired: true, loginRequired: true,
children: [{
path: '/profile',
name: 'profile',
component: page(() => import('./pages/settings/profile.vue')),
}, {
path: '/privacy',
name: 'privacy',
component: page(() => import('./pages/settings/privacy.vue')),
}, {
path: '/reaction',
name: 'reaction',
component: page(() => import('./pages/settings/reaction.vue')),
}, {
path: '/drive',
name: 'drive',
component: page(() => import('./pages/settings/drive.vue')),
}, {
path: '/notifications',
name: 'notifications',
component: page(() => import('./pages/settings/notifications.vue')),
}, {
path: '/email',
name: 'email',
component: page(() => import('./pages/settings/email.vue')),
}, {
path: '/integration',
name: 'integration',
component: page(() => import('./pages/settings/integration.vue')),
}, {
path: '/security',
name: 'security',
component: page(() => import('./pages/settings/security.vue')),
}, {
path: '/general',
name: 'general',
component: page(() => import('./pages/settings/general.vue')),
}, {
path: '/theme/install',
name: 'theme',
component: page(() => import('./pages/settings/theme.install.vue')),
}, {
path: '/theme/manage',
name: 'theme',
component: page(() => import('./pages/settings/theme.manage.vue')),
}, {
path: '/theme',
name: 'theme',
component: page(() => import('./pages/settings/theme.vue')),
}, {
path: '/navbar',
name: 'navbar',
component: page(() => import('./pages/settings/navbar.vue')),
}, {
path: '/statusbar',
name: 'statusbar',
component: page(() => import('./pages/settings/statusbar.vue')),
}, {
path: '/sounds',
name: 'sounds',
component: page(() => import('./pages/settings/sounds.vue')),
}, {
path: '/plugin',
name: 'plugin',
component: page(() => import('./pages/settings/plugin.vue')),
}, {
path: '/import-export',
name: 'import-export',
component: page(() => import('./pages/settings/import-export.vue')),
}, {
path: '/instance-mute',
name: 'instance-mute',
component: page(() => import('./pages/settings/instance-mute.vue')),
}, {
path: '/mute-block',
name: 'mute-block',
component: page(() => import('./pages/settings/mute-block.vue')),
}, {
path: '/word-mute',
name: 'word-mute',
component: page(() => import('./pages/settings/word-mute.vue')),
}, {
path: '/api',
name: 'api',
component: page(() => import('./pages/settings/api.vue')),
}, {
path: '/webhook/edit/:webhookId',
name: 'webhook',
component: page(() => import('./pages/settings/webhook.edit.vue')),
}, {
path: '/webhook/new',
name: 'webhook',
component: page(() => import('./pages/settings/webhook.new.vue')),
}, {
path: '/webhook',
name: 'webhook',
component: page(() => import('./pages/settings/webhook.vue')),
}, {
path: '/deck',
name: 'deck',
component: page(() => import('./pages/settings/deck.vue')),
}, {
path: '/other',
name: 'other',
component: page(() => import('./pages/settings/other.vue')),
}, {
path: '/',
component: page(() => import('./pages/_empty_.vue')),
}],
}, { }, {
path: '/reset-password/:token?', path: '/reset-password/:token?',
component: page(() => import('./pages/reset-password.vue')), component: page(() => import('./pages/reset-password.vue')),
@ -166,8 +274,84 @@ export const routes = [{
path: '/admin/file/:fileId', path: '/admin/file/:fileId',
component: iAmModerator ? page(() => import('./pages/admin-file.vue')) : page(() => import('./pages/not-found.vue')), component: iAmModerator ? page(() => import('./pages/admin-file.vue')) : page(() => import('./pages/not-found.vue')),
}, { }, {
path: '/admin/:initialPage(*)?', path: '/admin',
component: iAmModerator ? page(() => import('./pages/admin/index.vue')) : page(() => import('./pages/not-found.vue')), component: iAmModerator ? page(() => import('./pages/admin/index.vue')) : page(() => import('./pages/not-found.vue')),
children: [{
path: '/overview',
name: 'overview',
component: page(() => import('./pages/admin/overview.vue')),
}, {
path: '/users',
name: 'users',
component: page(() => import('./pages/admin/users.vue')),
}, {
path: '/emojis',
name: 'emojis',
component: page(() => import('./pages/admin/emojis.vue')),
}, {
path: '/queue',
name: 'queue',
component: page(() => import('./pages/admin/queue.vue')),
}, {
path: '/files',
name: 'files',
component: page(() => import('./pages/admin/files.vue')),
}, {
path: '/announcements',
name: 'announcements',
component: page(() => import('./pages/admin/announcements.vue')),
}, {
path: '/ads',
name: 'ads',
component: page(() => import('./pages/admin/ads.vue')),
}, {
path: '/database',
name: 'database',
component: page(() => import('./pages/admin/database.vue')),
}, {
path: '/abuses',
name: 'abuses',
component: page(() => import('./pages/admin/abuses.vue')),
}, {
path: '/settings',
name: 'settings',
component: page(() => import('./pages/admin/settings.vue')),
}, {
path: '/email-settings',
name: 'email-settings',
component: page(() => import('./pages/admin/email-settings.vue')),
}, {
path: '/object-storage',
name: 'object-storage',
component: page(() => import('./pages/admin/object-storage.vue')),
}, {
path: '/security',
name: 'security',
component: page(() => import('./pages/admin/security.vue')),
}, {
path: '/relays',
name: 'relays',
component: page(() => import('./pages/admin/relays.vue')),
}, {
path: '/integrations',
name: 'integrations',
component: page(() => import('./pages/admin/integrations.vue')),
}, {
path: '/instance-block',
name: 'instance-block',
component: page(() => import('./pages/admin/instance-block.vue')),
}, {
path: '/proxy-account',
name: 'proxy-account',
component: page(() => import('./pages/admin/proxy-account.vue')),
}, {
path: '/other-settings',
name: 'other-settings',
component: page(() => import('./pages/admin/other-settings.vue')),
}, {
path: '/',
component: page(() => import('./pages/_empty_.vue')),
}],
}, { }, {
path: '/my/notifications', path: '/my/notifications',
component: page(() => import('./pages/notifications.vue')), component: page(() => import('./pages/notifications.vue')),
@ -270,12 +454,16 @@ mainRouter.addListener('push', ctx => {
} }
}); });
mainRouter.addListener('replace', ctx => {
window.history.replaceState({ key: ctx.key }, '', ctx.path);
});
mainRouter.addListener('same', () => { mainRouter.addListener('same', () => {
window.scroll({ top: 0, behavior: 'smooth' }); window.scroll({ top: 0, behavior: 'smooth' });
}); });
window.addEventListener('popstate', (event) => { window.addEventListener('popstate', (event) => {
mainRouter.change(location.pathname + location.search + location.hash, event.state?.key); mainRouter.replace(location.pathname + location.search + location.hash, event.state?.key, false);
const scrollPos = scrollPosStore.get(event.state?.key) ?? 0; const scrollPos = scrollPosStore.get(event.state?.key) ?? 0;
window.scroll({ top: scrollPos, behavior: 'instant' }); window.scroll({ top: scrollPos, behavior: 'instant' });
window.setTimeout(() => { // 遷移直後はタイミングによってはコンポーネントが復元し切ってない可能性も考えられるため少し時間を空けて再度スクロール window.setTimeout(() => { // 遷移直後はタイミングによってはコンポーネントが復元し切ってない可能性も考えられるため少し時間を空けて再度スクロール

View file

@ -9,30 +9,30 @@
</div> </div>
<div class="middle"> <div class="middle">
<MkA v-click-anime class="item index" active-class="active" to="/" exact> <MkA v-click-anime class="item index" active-class="active" to="/" exact>
<i class="icon fas fa-home fa-fw"></i><span class="text">{{ $ts.timeline }}</span> <i class="icon fas fa-home fa-fw"></i><span class="text">{{ i18n.ts.timeline }}</span>
</MkA> </MkA>
<template v-for="item in menu"> <template v-for="item in menu">
<div v-if="item === '-'" class="divider"></div> <div v-if="item === '-'" class="divider"></div>
<component :is="navbarItemDef[item].to ? 'MkA' : 'button'" v-else-if="navbarItemDef[item] && (navbarItemDef[item].show !== false)" v-click-anime class="item _button" :class="[item, { active: navbarItemDef[item].active }]" active-class="active" :to="navbarItemDef[item].to" v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}"> <component :is="navbarItemDef[item].to ? 'MkA' : 'button'" v-else-if="navbarItemDef[item] && (navbarItemDef[item].show !== false)" v-click-anime class="item _button" :class="[item, { active: navbarItemDef[item].active }]" active-class="active" :to="navbarItemDef[item].to" v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}">
<i class="icon fa-fw" :class="navbarItemDef[item].icon"></i><span class="text">{{ $ts[navbarItemDef[item].title] }}</span> <i class="icon fa-fw" :class="navbarItemDef[item].icon"></i><span class="text">{{ i18n.ts[navbarItemDef[item].title] }}</span>
<span v-if="navbarItemDef[item].indicated" class="indicator"><i class="icon fas fa-circle"></i></span> <span v-if="navbarItemDef[item].indicated" class="indicator"><i class="icon fas fa-circle"></i></span>
</component> </component>
</template> </template>
<div class="divider"></div> <div class="divider"></div>
<MkA v-if="$i.isAdmin || $i.isModerator" v-click-anime class="item" active-class="active" to="/admin"> <MkA v-if="$i.isAdmin || $i.isModerator" v-click-anime class="item" active-class="active" to="/admin">
<i class="icon fas fa-door-open fa-fw"></i><span class="text">{{ $ts.controlPanel }}</span> <i class="icon fas fa-door-open fa-fw"></i><span class="text">{{ i18n.ts.controlPanel }}</span>
</MkA> </MkA>
<button v-click-anime class="item _button" @click="more"> <button v-click-anime class="item _button" @click="more">
<i class="icon fa fa-ellipsis-h fa-fw"></i><span class="text">{{ $ts.more }}</span> <i class="icon fa fa-ellipsis-h fa-fw"></i><span class="text">{{ i18n.ts.more }}</span>
<span v-if="otherMenuItemIndicated" class="indicator"><i class="icon fas fa-circle"></i></span> <span v-if="otherMenuItemIndicated" class="indicator"><i class="icon fas fa-circle"></i></span>
</button> </button>
<MkA v-click-anime class="item" active-class="active" to="/settings"> <MkA v-click-anime class="item" active-class="active" to="/settings">
<i class="icon fas fa-cog fa-fw"></i><span class="text">{{ $ts.settings }}</span> <i class="icon fas fa-cog fa-fw"></i><span class="text">{{ i18n.ts.settings }}</span>
</MkA> </MkA>
</div> </div>
<div class="bottom"> <div class="bottom">
<button class="item _button post" data-cy-open-post-form @click="os.post"> <button class="item _button post" data-cy-open-post-form @click="os.post">
<i class="icon fas fa-pencil-alt fa-fw"></i><span class="text">{{ $ts.note }}</span> <i class="icon fas fa-pencil-alt fa-fw"></i><span class="text">{{ i18n.ts.note }}</span>
</button> </button>
<button v-click-anime class="item _button account" @click="openAccountMenu"> <button v-click-anime class="item _button account" @click="openAccountMenu">
<MkAvatar :user="$i" class="avatar"/><MkAcct class="text" :user="$i"/> <MkAvatar :user="$i" class="avatar"/><MkAcct class="text" :user="$i"/>

View file

@ -1,9 +1,9 @@
<template> <template>
<div v-if="hasDisconnected && $store.state.serverDisconnectedBehavior === 'quiet'" class="nsbbhtug" @click="resetDisconnected"> <div v-if="hasDisconnected && $store.state.serverDisconnectedBehavior === 'quiet'" class="nsbbhtug" @click="resetDisconnected">
<div>{{ $ts.disconnectedFromServer }}</div> <div>{{ i18n.ts.disconnectedFromServer }}</div>
<div class="command"> <div class="command">
<button class="_textButton" @click="reload">{{ $ts.reload }}</button> <button class="_textButton" @click="reload">{{ i18n.ts.reload }}</button>
<button class="_textButton">{{ $ts.doNothing }}</button> <button class="_textButton">{{ i18n.ts.doNothing }}</button>
</div> </div>
</div> </div>
</template> </template>
@ -11,6 +11,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { onUnmounted } from 'vue'; import { onUnmounted } from 'vue';
import { stream } from '@/stream'; import { stream } from '@/stream';
import { i18n } from '@/i18n';
let hasDisconnected = $ref(false); let hasDisconnected = $ref(false);

View file

@ -6,7 +6,7 @@
<div class="top"> <div class="top">
<p class="name"><i class="fas fa-spinner fa-pulse"></i>{{ ctx.name }}</p> <p class="name"><i class="fas fa-spinner fa-pulse"></i>{{ ctx.name }}</p>
<p class="status"> <p class="status">
<span v-if="ctx.progressValue === undefined" class="initing">{{ $ts.waiting }}<MkEllipsis/></span> <span v-if="ctx.progressValue === undefined" class="initing">{{ i18n.ts.waiting }}<MkEllipsis/></span>
<span v-if="ctx.progressValue !== undefined" class="kb">{{ String(Math.floor(ctx.progressValue / 1024)).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,') }}<i>KB</i> / {{ String(Math.floor(ctx.progressMax / 1024)).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,') }}<i>KB</i></span> <span v-if="ctx.progressValue !== undefined" class="kb">{{ String(Math.floor(ctx.progressValue / 1024)).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,') }}<i>KB</i> / {{ String(Math.floor(ctx.progressMax / 1024)).replace(/(\d)(?=(\d\d\d)+(?!\d))/g, '$1,') }}<i>KB</i></span>
<span v-if="ctx.progressValue !== undefined" class="percentage">{{ Math.floor((ctx.progressValue / ctx.progressMax) * 100) }}</span> <span v-if="ctx.progressValue !== undefined" class="percentage">{{ Math.floor((ctx.progressValue / ctx.progressMax) * 100) }}</span>
</p> </p>
@ -21,6 +21,7 @@
import { } from 'vue'; import { } from 'vue';
import * as os from '@/os'; import * as os from '@/os';
import { uploads } from '@/scripts/upload'; import { uploads } from '@/scripts/upload';
import { i18n } from '@/i18n';
const zIndex = os.claimZIndex('high'); const zIndex = os.claimZIndex('high');
</script> </script>

View file

@ -1,6 +1,6 @@
<template> <template>
<MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent" class="mkw-activity"> <MkContainer :show-header="widgetProps.showHeader" :naked="widgetProps.transparent" class="mkw-activity">
<template #header><i class="fas fa-chart-simple"></i>{{ $ts._widgets.activity }}</template> <template #header><i class="fas fa-chart-simple"></i>{{ i18n.ts._widgets.activity }}</template>
<template #func><button class="_button" @click="toggleView()"><i class="fas fa-sort"></i></button></template> <template #func><button class="_button" @click="toggleView()"><i class="fas fa-sort"></i></button></template>
<div> <div>
@ -22,6 +22,7 @@ import { GetFormResultType } from '@/scripts/form';
import * as os from '@/os'; import * as os from '@/os';
import MkContainer from '@/components/ui/container.vue'; import MkContainer from '@/components/ui/container.vue';
import { $i } from '@/account'; import { $i } from '@/account';
import { i18n } from '@/i18n';
const name = 'activity'; const name = 'activity';

View file

@ -1,6 +1,6 @@
<template> <template>
<MkContainer :show-header="widgetProps.showHeader" class="mkw-aiscript"> <MkContainer :show-header="widgetProps.showHeader" class="mkw-aiscript">
<template #header><i class="fas fa-terminal"></i>{{ $ts._widgets.aiscript }}</template> <template #header><i class="fas fa-terminal"></i>{{ i18n.ts._widgets.aiscript }}</template>
<div class="uylguesu _monospace"> <div class="uylguesu _monospace">
<textarea v-model="widgetProps.script" placeholder="(1 + 1)"></textarea> <textarea v-model="widgetProps.script" placeholder="(1 + 1)"></textarea>
@ -14,13 +14,14 @@
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, onUnmounted, ref, watch } from 'vue'; import { onMounted, onUnmounted, ref, watch } from 'vue';
import { GetFormResultType } from '@/scripts/form'; import { AiScript, parse, utils } from '@syuilo/aiscript';
import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget'; import { useWidgetPropsManager, Widget, WidgetComponentEmits, WidgetComponentExpose, WidgetComponentProps } from './widget';
import { GetFormResultType } from '@/scripts/form';
import * as os from '@/os'; import * as os from '@/os';
import MkContainer from '@/components/ui/container.vue'; import MkContainer from '@/components/ui/container.vue';
import { AiScript, parse, utils } from '@syuilo/aiscript';
import { createAiScriptEnv } from '@/scripts/aiscript/api'; import { createAiScriptEnv } from '@/scripts/aiscript/api';
import { $i } from '@/account'; import { $i } from '@/account';
import { i18n } from '@/i18n';
const name = 'aiscript'; const name = 'aiscript';
@ -88,7 +89,7 @@ const run = async () => {
}); break; }); break;
default: break; default: break;
} }
} },
}); });
let ast; let ast;

View file

@ -11,19 +11,19 @@
</div> </div>
<div class="info"> <div class="info">
<div> <div>
<p>{{ $ts.today }}: <b>{{ dayP.toFixed(1) }}%</b></p> <p>{{ i18n.ts.today }}: <b>{{ dayP.toFixed(1) }}%</b></p>
<div class="meter"> <div class="meter">
<div class="val" :style="{ width: `${dayP}%` }"></div> <div class="val" :style="{ width: `${dayP}%` }"></div>
</div> </div>
</div> </div>
<div> <div>
<p>{{ $ts.thisMonth }}: <b>{{ monthP.toFixed(1) }}%</b></p> <p>{{ i18n.ts.thisMonth }}: <b>{{ monthP.toFixed(1) }}%</b></p>
<div class="meter"> <div class="meter">
<div class="val" :style="{ width: `${monthP}%` }"></div> <div class="val" :style="{ width: `${monthP}%` }"></div>
</div> </div>
</div> </div>
<div> <div>
<p>{{ $ts.thisYear }}: <b>{{ yearP.toFixed(1) }}%</b></p> <p>{{ i18n.ts.thisYear }}: <b>{{ yearP.toFixed(1) }}%</b></p>
<div class="meter"> <div class="meter">
<div class="val" :style="{ width: `${yearP}%` }"></div> <div class="val" :style="{ width: `${yearP}%` }"></div>
</div> </div>

View file

@ -1,6 +1,6 @@
<template> <template>
<MkContainer :show-header="widgetProps.showHeader" :foldable="foldable" :scrollable="scrollable" class="mkw-federation"> <MkContainer :show-header="widgetProps.showHeader" :foldable="foldable" :scrollable="scrollable" class="mkw-federation">
<template #header><i class="fas fa-globe"></i>{{ $ts._widgets.federation }}</template> <template #header><i class="fas fa-globe"></i>{{ i18n.ts._widgets.federation }}</template>
<div class="wbrkwalb"> <div class="wbrkwalb">
<MkLoading v-if="fetching"/> <MkLoading v-if="fetching"/>
@ -26,6 +26,7 @@ import MkContainer from '@/components/ui/container.vue';
import MkMiniChart from '@/components/mini-chart.vue'; import MkMiniChart from '@/components/mini-chart.vue';
import * as os from '@/os'; import * as os from '@/os';
import { useInterval } from '@/scripts/use-interval'; import { useInterval } from '@/scripts/use-interval';
import { i18n } from '@/i18n';
const name = 'federation'; const name = 'federation';

Some files were not shown because too many files have changed in this diff Show more