hamlab/mobilizon-frontend
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add global search

Browse Source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2022-08-26 16:08:58 +02:00
parent bfc936f57c
commit 48935e2168
216 changed files with 3646 additions and 2806 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
js/src/views/Admin/AdminGroupProfile.vue
View File

@@ -112,33 +112,27 @@
:label="t('Member')"
v-slot="props"
>
<article class="media">
<figure
class="media-left image is-48x48"
v-if="props.row.actor.avatar"
>
<img
class="is-rounded"
:src="props.row.actor.avatar.url"
alt=""
/>
</figure>
<o-icon
class="media-left"
v-else
size="large"
icon="account-circle"
/>
<div class="media-content">
<article class="flex gap-1">
<div class="flex-none">
<figure v-if="props.row.actor.avatar">
<img
class="rounded"
:src="props.row.actor.avatar.url"
alt=""
width="48"
height="48"
/>
</figure>
<AccountCircle :size="48" v-else />
</div>
<div>
<div class="prose dark:prose-invert">
<span v-if="props.row.actor.name">{{
props.row.actor.name
}}</span
><span v-else>@{{ usernameWithDomain(props.row.actor) }}</span
><br />
<span
v-if="props.row.actor.name"
class="is-size-7 has-text-grey"
<span v-if="props.row.actor.name"
>@{{ usernameWithDomain(props.row.actor) }}</span
>
</div>
@@ -146,39 +140,39 @@
</article>
</o-table-column>
<o-table-column field="role" :label="t('Role')" v-slot="props">
<b-tag
<tag
variant="primary"
v-if="props.row.role === MemberRole.ADMINISTRATOR"
>
{{ t("Administrator") }}
</b-tag>
<b-tag
</tag>
<tag
variant="primary"
v-else-if="props.row.role === MemberRole.MODERATOR"
>
{{ t("Moderator") }}
</b-tag>
<b-tag v-else-if="props.row.role === MemberRole.MEMBER">
</tag>
<tag v-else-if="props.row.role === MemberRole.MEMBER">
{{ t("Member") }}
</b-tag>
<b-tag
</tag>
<tag
variant="warning"
v-else-if="props.row.role === MemberRole.NOT_APPROVED"
>
{{ t("Not approved") }}
</b-tag>
<b-tag
</tag>
<tag
variant="danger"
v-else-if="props.row.role === MemberRole.REJECTED"
>
{{ t("Rejected") }}
</b-tag>
<b-tag
</tag>
<tag
variant="danger"
v-else-if="props.row.role === MemberRole.INVITED"
>
{{ t("Invited") }}
</b-tag>
</tag>
</o-table-column>
<o-table-column field="insertedAt" :label="t('Date')" v-slot="props">
<span class="has-text-centered">
@@ -225,9 +219,7 @@
:to="{ name: RouteName.EVENT, params: { uuid: props.row.uuid } }"
>
{{ props.row.title }}
<b-tag variant="info" v-if="props.row.draft">{{
t("Draft")
}}</b-tag>
<tag variant="info" v-if="props.row.draft">{{ t("Draft") }}</tag>
</router-link>
</o-table-column>
<o-table-column field="beginsOn" :label="t('Begins on')" v-slot="props">
@@ -271,9 +263,7 @@
:to="{ name: RouteName.POST, params: { slug: props.row.slug } }"
>
{{ props.row.title }}
<b-tag variant="info" v-if="props.row.draft">{{
t("Draft")
}}</b-tag>
<tag variant="info" v-if="props.row.draft">{{ t("Draft") }}</tag>
</router-link>
</o-table-column>
<o-table-column
@@ -295,7 +285,7 @@
{{ t("This group was not found") }}
<template #desc>
<o-button
type="is-text"
variant="text"
tag="router-link"
:to="{ name: RouteName.ADMIN_GROUPS }"
>{{ t("Back to group list") }}</o-button
@@ -330,6 +320,8 @@ import {
} from "@/filters/datetime";
import { Dialog } from "@/plugins/dialog";
import { Notifier } from "@/plugins/notifier";
import AccountCircle from "vue-material-design-icons/AccountCircle.vue";
import Tag from "@/components/Tag.vue";
const EVENTS_PER_PAGE = 10;
const POSTS_PER_PAGE = 10;
@@ -396,23 +388,21 @@ const dialog = inject<Dialog>("dialog");
const notifier = inject<Notifier>("notifier");
const confirmSuspendProfile = (): void => {
const message = (
group.value.domain
? t(
"Are you sure you want to <b>suspend</b> this group? As this group originates from instance {instance}, this will only remove local members and delete the local data, as well as rejecting all the future data.",
{ instance: group.value.domain }
)
: t(
"Are you sure you want to <b>suspend</b> this group? All members - including remote ones - will be notified and removed from the group, and <b>all of the group data (events, posts, discussions, todos…) will be irretrievably destroyed</b>."
)
) as string;
const message = group.value.domain
? t(
"Are you sure you want to <b>suspend</b> this group? As this group originates from instance {instance}, this will only remove local members and delete the local data, as well as rejecting all the future data.",
{ instance: group.value.domain }
)
: t(
"Are you sure you want to <b>suspend</b> this group? All members - including remote ones - will be notified and removed from the group, and <b>all of the group data (events, posts, discussions, todos…) will be irretrievably destroyed</b>."
);
dialog?.confirm({
title: t("Suspend group") as string,
title: t("Suspend group"),
message,
confirmText: t("Suspend group") as string,
cancelText: t("Cancel") as string,
type: "danger",
confirmText: t("Suspend group"),
cancelText: t("Cancel"),
variant: "danger",
hasIcon: true,
onConfirm: () =>
suspendProfile({

53
js/src/views/Admin/AdminProfile.vue
View File

@@ -34,14 +34,14 @@
<tr
v-for="{ key, value, link } in metadata"
:key="key"
class="odd:bg-white even:bg-gray-50 border-b"
class="odd:bg-white dark:odd:bg-zinc-800 even:bg-gray-50 dark:even:bg-zinc-700 border-b"
>
<td class="py-4 px-2 whitespace-nowrap">
{{ key }}
</td>
<td
v-if="link"
class="py-4 px-2 text-sm text-gray-500 whitespace-nowrap"
class="py-4 px-2 text-sm text-gray-500 dark:text-gray-200 whitespace-nowrap"
>
<router-link :to="link">
{{ value }}
@@ -49,7 +49,7 @@
</td>
<td
v-else
class="py-4 px-2 text-sm text-gray-500 whitespace-nowrap"
class="py-4 px-2 text-sm text-gray-500 dark:text-gray-200 whitespace-nowrap"
>
{{ value }}
</td>
@@ -102,7 +102,7 @@
<section class="mt-4 mb-3">
<h2 class="">{{ $t("Organized events") }}</h2>
<o-table
:data="person.organizedEvents.elements"
:data="person.organizedEvents?.elements"
:loading="loading"
paginated
backend-pagination
@@ -111,7 +111,7 @@
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
:total="person.organizedEvents.total"
:total="person.organizedEvents?.total"
:per-page="EVENTS_PER_PAGE"
@page-change="onOrganizedEventsPageChange"
>
@@ -140,7 +140,7 @@
<h2 class="">{{ $t("Participations") }}</h2>
<o-table
:data="
person.participations.elements.map(
person.participations?.elements.map(
(participation) => participation.event
)
"
@@ -152,7 +152,7 @@
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
:total="person.participations.total"
:total="person.participations?.total"
:per-page="EVENTS_PER_PAGE"
@page-change="onParticipationsPageChange"
>
@@ -180,7 +180,7 @@
<section class="mt-4 mb-3">
<h2 class="">{{ $t("Memberships") }}</h2>
<o-table
:data="person.memberships.elements"
:data="person.memberships?.elements"
:loading="loading"
paginated
backend-pagination
@@ -189,7 +189,7 @@
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
:total="person.memberships.total"
:total="person.memberships?.total"
:per-page="EVENTS_PER_PAGE"
@page-change="onMembershipsPageChange"
>
@@ -215,47 +215,45 @@
props.row.parent.name
}}</span
><br />
<span class="is-size-7 has-text-grey"
>@{{ usernameWithDomain(props.row.parent) }}</span
>
<span>@{{ usernameWithDomain(props.row.parent) }}</span>
</div>
</div>
</article>
</o-table-column>
<o-table-column field="role" :label="$t('Role')" v-slot="props">
<b-tag
<tag
variant="primary"
v-if="props.row.role === MemberRole.ADMINISTRATOR"
>
{{ $t("Administrator") }}
</b-tag>
<b-tag
</tag>
<tag
variant="primary"
v-else-if="props.row.role === MemberRole.MODERATOR"
>
{{ $t("Moderator") }}
</b-tag>
<b-tag v-else-if="props.row.role === MemberRole.MEMBER">
</tag>
<tag v-else-if="props.row.role === MemberRole.MEMBER">
{{ $t("Member") }}
</b-tag>
<b-tag
</tag>
<tag
variant="warning"
v-else-if="props.row.role === MemberRole.NOT_APPROVED"
>
{{ $t("Not approved") }}
</b-tag>
<b-tag
</tag>
<tag
variant="danger"
v-else-if="props.row.role === MemberRole.REJECTED"
>
{{ $t("Rejected") }}
</b-tag>
<b-tag
</tag>
<tag
variant="danger"
v-else-if="props.row.role === MemberRole.INVITED"
>
{{ $t("Invited") }}
</b-tag>
</tag>
</o-table-column>
<o-table-column field="insertedAt" :label="$t('Date')" v-slot="props">
<span class="has-text-centered">
@@ -276,7 +274,7 @@
{{ $t("This profile was not found") }}
<template #desc>
<o-button
type="is-text"
variant="text"
tag="router-link"
:to="{ name: RouteName.PROFILES }"
>{{ $t("Back to profile list") }}</o-button
@@ -310,6 +308,7 @@ import {
formatDateTimeString,
} from "@/filters/datetime";
import AccountCircle from "vue-material-design-icons/AccountCircle.vue";
import Tag from "@/components/Tag.vue";
const EVENTS_PER_PAGE = 10;
const PARTICIPATIONS_PER_PAGE = 10;
@@ -423,7 +422,7 @@ const { mutate: suspendProfile } = useMutation<
});
if (!profileData) return;
const { person } = profileData;
const { person: cachedPerson } = profileData;
store.writeQuery({
query: GET_PERSON,
variables: {
@@ -431,7 +430,7 @@ const { mutate: suspendProfile } = useMutation<
},
data: {
person: {
...cloneDeep(person),
...cloneDeep(cachedPerson),
participations: { total: 0, elements: [] },
suspended: true,
avatar: null,

20
js/src/views/Admin/AdminUserProfile.vue
View File

@@ -24,7 +24,7 @@
<table v-if="metadata.length > 0" class="min-w-full">
<tbody>
<tr
class="odd:bg-white even:bg-gray-50 border-b"
class="border-b"
v-for="{ key, value, type } in metadata"
:key="key"
>
@@ -67,7 +67,7 @@
size="small"
v-if="!user.disabled"
@click="isEmailChangeModalActive = true"
type="is-text"
variant="text"
icon-left="pencil"
>{{ t("Change email") }}</o-button
>
@@ -78,7 +78,7 @@
query: { emailFilter: `@${userEmailDomain}` },
}"
size="small"
type="is-text"
variant="text"
icon-left="magnify"
>{{
t("Other users with the same email domain")
@@ -93,7 +93,7 @@
size="small"
v-if="!user.confirmedAt || user.disabled"
@click="isConfirmationModalActive = true"
type="is-text"
variant="text"
icon-left="check"
>{{ t("Confirm user") }}</o-button
>
@@ -106,7 +106,7 @@
size="small"
v-if="!user.disabled"
@click="isRoleChangeModalActive = true"
type="is-text"
variant="text"
icon-left="chevron-double-up"
>{{ t("Change role") }}</o-button
>
@@ -122,7 +122,7 @@
query: { ipFilter: user.currentSignInIp },
}"
size="small"
type="is-text"
variant="text"
icon-left="web"
>{{
t("Other users with the same IP address")
@@ -192,7 +192,7 @@
</header>
<section class="">
<o-field :label="t('Previous email')">
<o-input type="email" :value="user.email" disabled> </o-input>
<o-input type="email" v-model="user.email" disabled />
</o-field>
<o-field :label="t('New email')">
<o-input
@@ -208,7 +208,7 @@
}}</o-checkbox>
</section>
<footer class="mt-2 flex gap-2">
<o-button @click="isEmailChangeModalActive = false">{{
<o-button outlined @click="isEmailChangeModalActive = false">{{
t("Close")
}}</o-button>
<o-button native-type="submit" variant="primary">{{
@@ -309,7 +309,7 @@
{{ t("This user was not found") }}
<template #desc>
<o-button
type="is-text"
variant="text"
tag="router-link"
:to="{ name: RouteName.USERS }"
>{{ t("Back to user list") }}</o-button
@@ -459,7 +459,7 @@ const suspendAccount = async (): Promise<void> => {
),
confirmText: t("Suspend the account"),
cancelText: t("Cancel"),
type: "is-danger",
variant: "danger",
onConfirm: async () => {
suspendUser({
userId: props.id,

32
js/src/views/Admin/GroupProfiles.vue
View File

@@ -2,10 +2,10 @@
<div>
<breadcrumbs-nav
:links="[
{ name: RouteName.MODERATION, text: $t('Moderation') },
{ name: RouteName.MODERATION, text: t('Moderation') },
{
name: RouteName.ADMIN_GROUPS,
text: $t('Groups'),
text: t('Groups'),
},
]"
/>
@@ -13,13 +13,13 @@
<router-link
class="button is-primary"
:to="{ name: RouteName.CREATE_GROUP }"
>{{ $t("Create group") }}</router-link
>{{ t("Create group") }}</router-link
>
</div>
<div v-if="groups">
<div class="flex gap-2">
<o-switch v-model="local">{{ $t("Local") }}</o-switch>
<o-switch v-model="suspended">{{ $t("Suspended") }}</o-switch>
<o-switch v-model="local">{{ t("Local") }}</o-switch>
<o-switch v-model="suspended">{{ t("Suspended") }}</o-switch>
</div>
<o-table
:data="groups.elements"
@@ -29,10 +29,10 @@
backend-filtering
:debounce-search="200"
v-model:current-page="page"
:aria-next-label="$t('Next page')"
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
:aria-next-label="t('Next page')"
:aria-previous-label="t('Previous page')"
:aria-page-label="t('Page')"
:aria-current-label="t('Current page')"
:total="groups.total"
:per-page="PROFILES_PER_PAGE"
@page-change="onPageChange"
@@ -40,14 +40,14 @@
>
<o-table-column
field="preferredUsername"
:label="$t('Username')"
:label="t('Username')"
searchable
>
<template #searchable="props">
<o-input
:aria-label="$t('Filter')"
:aria-label="t('Filter')"
v-model="props.filters.preferredUsername"
:placeholder="$t('Filter')"
:placeholder="t('Filter')"
icon="magnify"
/>
</template>
@@ -82,12 +82,12 @@
</template>
</o-table-column>
<o-table-column field="domain" :label="$t('Domain')" searchable>
<o-table-column field="domain" :label="t('Domain')" searchable>
<template #searchable="props">
<o-input
:aria-label="$t('Filter')"
:aria-label="t('Filter')"
v-model="props.filters.domain"
:placeholder="$t('Filter')"
:placeholder="t('Filter')"
icon="magnify"
/>
</template>
@@ -97,7 +97,7 @@
</o-table-column>
<template #empty>
<empty-content icon="account-group" :inline="true">
{{ $t("No group matches the filters") }}
{{ t("No group matches the filters") }}
</empty-content>
</template>
</o-table>

25
js/src/views/Admin/Instance.vue → js/src/views/Admin/InstanceView.vue
View File

@@ -11,7 +11,7 @@
<div
class="grid md:grid-cols-2 xl:grid-cols-4 gap-2 content-center text-center mt-2"
>
<div class="bg-gray-50 rounded-xl p-8">
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<router-link
:to="{
name: RouteName.PROFILES,
@@ -24,7 +24,7 @@
<span class="text-sm block">{{ $t("Profiles") }}</span>
</router-link>
</div>
<div class="bg-gray-50 rounded-xl p-8">
<div class="bg-gray-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<router-link
:to="{
name: RouteName.ADMIN_GROUPS,
@@ -37,19 +37,19 @@
<span class="text-sm block">{{ $t("Groups") }}</span>
</router-link>
</div>
<div class="bg-gray-50 rounded-xl p-8">
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<span class="mb-4 text-xl font-semibold block">{{
instance.followingsCount
}}</span>
<span class="text-sm block">{{ $t("Followings") }}</span>
</div>
<div class="bg-gray-50 rounded-xl p-8">
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<span class="mb-4 text-xl font-semibold block">{{
instance.followersCount
}}</span>
<span class="text-sm block">{{ $t("Followers") }}</span>
</div>
<div class="bg-gray-50 rounded-xl p-8">
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<router-link
:to="{ name: RouteName.REPORTS, query: { domain: instance.domain } }"
>
@@ -59,7 +59,7 @@
<span class="text-sm block">{{ $t("Reports") }}</span>
</router-link>
</div>
<div class="bg-gray-50 rounded-xl p-8">
<div class="bg-zinc-50 dark:bg-mbz-purple-500 rounded-xl p-8">
<span class="mb-4 font-semibold block">{{
formatBytes(instance.mediaSize)
}}</span>
@@ -68,7 +68,7 @@
</div>
<div class="mt-3 grid xl:grid-cols-2 gap-4">
<div
class="border bg-white p-6 shadow-md rounded-md"
class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md"
v-if="instance.hasRelay"
>
<button
@@ -104,7 +104,9 @@
<div v-else class="md:h-48 py-16 text-center opacity-50">
{{ $t("Only Mobilizon instances can be followed") }}
</div>
<div class="border bg-white p-6 shadow-md rounded-md flex flex-col gap-2">
<div
class="border bg-white dark:bg-mbz-purple-500 dark:border-mbz-purple-700 p-6 shadow-md rounded-md flex flex-col gap-2"
>
<button
@click="
acceptInstance({
@@ -140,6 +142,7 @@ import {
ADD_INSTANCE,
INSTANCE,
REJECT_RELAY,
REMOVE_RELAY,
} from "@/graphql/admin";
import { formatBytes } from "@/utils/datetime";
import RouteName from "@/router/name";
@@ -215,7 +218,7 @@ onRejectInstanceError((error) => {
});
const { mutate: followInstanceMutation, onError: onFollowInstanceError } =
useMutation(ADD_INSTANCE);
useMutation<{ addInstance: IInstance }>(ADD_INSTANCE);
onFollowInstanceError((error) => {
if (error.graphQLErrors && error.graphQLErrors.length > 0) {
@@ -232,10 +235,10 @@ const followInstance = async (e: Event): Promise<void> => {
* Stop following instance
*/
const { mutate: removeInstanceFollow, onError: onRemoveInstanceFollowError } =
useMutation(REJECT_RELAY, () => ({
useMutation(REMOVE_RELAY, () => ({
update(cache: ApolloCache<any>) {
cache.writeFragment({
id: cache.identify(instance as unknown as Reference),
id: cache.identify(instance.value as unknown as Reference),
fragment: gql`
fragment InstanceFollowedStatus on Instance {
followedStatus

66
js/src/views/Admin/Instances.vue → js/src/views/Admin/InstancesView.vue
View File

@@ -2,24 +2,29 @@
<div>
<breadcrumbs-nav
:links="[
{ name: RouteName.ADMIN, text: $t('Admin') },
{ text: $t('Instances') },
{ name: RouteName.ADMIN, text: t('Admin') },
{ text: t('Instances') },
]"
/>
<section>
<h1 class="title">{{ $t("Instances") }}</h1>
<h1 class="title">{{ t("Instances") }}</h1>
<form @submit="followInstance" class="my-4">
<o-field :label="$t('Follow a new instance')" horizontal>
<o-field
:label="t('Follow a new instance')"
horizontal
label-for="newRelayAddress"
>
<o-field grouped group-multiline expanded size="large">
<p class="control">
<o-input
id="newRelayAddress"
v-model="newRelayAddress"
:placeholder="$t('Ex: mobilizon.fr')"
:placeholder="t('Ex: mobilizon.fr')"
/>
</p>
<p class="control">
<o-button variant="primary" native-type="submit">{{
$t("Add an instance")
t("Add an instance")
}}</o-button>
<o-loading
:is-full-page="true"
@@ -31,31 +36,31 @@
</o-field>
</form>
<div class="flex flex-wrap gap-2">
<o-field :label="$t('Follow status')">
<o-field :label="t('Follow status')">
<o-radio
v-model="followStatus"
:native-value="InstanceFilterFollowStatus.ALL"
>{{ $t("All") }}</o-radio
>{{ t("All") }}</o-radio
>
<o-radio
v-model="followStatus"
:native-value="InstanceFilterFollowStatus.FOLLOWING"
>{{ $t("Following") }}</o-radio
>{{ t("Following") }}</o-radio
>
<o-radio
v-model="followStatus"
:native-value="InstanceFilterFollowStatus.FOLLOWED"
>{{ $t("Followed") }}</o-radio
>{{ t("Followed") }}</o-radio
>
</o-field>
<o-field
:label="$t('Domain')"
:label="t('Domain')"
label-for="domain-filter"
class="flex-auto"
>
<o-input
id="domain-filter"
:placeholder="$t('mobilizon-instance.tld')"
:placeholder="t('mobilizon-instance.tld')"
:value="filterDomain"
@input="debouncedUpdateDomainFilter"
/>
@@ -67,7 +72,7 @@
name: RouteName.INSTANCE,
params: { domain: instance.domain },
}"
class="flex items-center mb-2 rounded bg-secondary p-4 flex-wrap justify-center gap-x-2 gap-y-3"
class="flex items-center mb-2 rounded bg-mbz-yellow-alt-300 dark:bg-mbz-purple-400 p-4 flex-wrap justify-center gap-x-2 gap-y-3"
v-for="instance in instances.elements"
:key="instance.domain"
>
@@ -75,19 +80,19 @@
<img
class="w-12"
v-if="instance.hasRelay"
src="../../assets/logo.svg"
src="/img/logo.svg"
alt=""
/>
<CloudQuestion v-else :size="36" />
<div class="">
<h4 class="text-lg truncate">{{ instance.domain }}</h4>
<h3 class="text-lg truncate">{{ instance.domain }}</h3>
<span
class="text-sm"
v-if="instance.followedStatus === InstanceFollowStatus.APPROVED"
>
<o-icon icon="inbox-arrow-down" />
{{ $t("Followed") }}</span
{{ t("Followed") }}</span
>
<span
class="text-sm"
@@ -96,32 +101,32 @@
"
>
<o-icon icon="inbox-arrow-down" />
{{ $t("Followed, pending response") }}</span
{{ t("Followed, pending response") }}</span
>
<span
class="text-sm"
v-if="instance.followerStatus == InstanceFollowStatus.APPROVED"
>
<o-icon icon="inbox-arrow-up" />
{{ $t("Follows us") }}</span
{{ t("Follows us") }}</span
>
<span
class="text-sm"
v-if="instance.followerStatus == InstanceFollowStatus.PENDING"
>
<o-icon icon="inbox-arrow-up" />
{{ $t("Follows us, pending approval") }}</span
{{ t("Follows us, pending approval") }}</span
>
</div>
</div>
<div class="flex-none flex gap-3 ltr:ml-3 rtl:mr-3">
<p class="flex flex-col text-center">
<span class="text-xl">{{ instance.eventCount }}</span
><span class="text-sm">{{ $t("Events") }}</span>
><span class="text-sm">{{ t("Events") }}</span>
</p>
<p class="flex flex-col text-center">
<span class="text-xl">{{ instance.personCount }}</span
><span class="text-sm">{{ $t("Profiles") }}</span>
><span class="text-sm">{{ t("Profiles") }}</span>
</p>
</div>
</router-link>
@@ -130,26 +135,26 @@
:total="instances.total"
v-model="instancePage"
:per-page="INSTANCES_PAGE_LIMIT"
:aria-next-label="$t('Next page')"
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
:aria-next-label="t('Next page')"
:aria-previous-label="t('Previous page')"
:aria-page-label="t('Page')"
:aria-current-label="t('Current page')"
>
</o-pagination>
</div>
<div v-else-if="instances && instances.elements.length == 0">
<empty-content icon="lan-disconnect" :inline="true">
{{ $t("No instance found.") }}
{{ t("No instance found.") }}
<template #desc>
<span v-if="hasFilter">
{{
$t(
t(
"No instances match this filter. Try resetting filter fields?"
)
}}
</span>
<span v-else>
{{ $t("You haven't interacted with other instances yet.") }}
{{ t("You haven't interacted with other instances yet.") }}
</span>
</template>
</empty-content>
@@ -176,10 +181,11 @@ import {
useRouteQuery,
} from "vue-use-route-query";
import { useMutation, useQuery } from "@vue/apollo-composable";
import { computed, ref } from "vue";
import { computed, inject, ref } from "vue";
import { useRouter } from "vue-router";
import { useHead } from "@vueuse/head";
import CloudQuestion from "../../../node_modules/vue-material-design-icons/CloudQuestion.vue";
import { Notifier } from "@/plugins/notifier";
const INSTANCES_PAGE_LIMIT = 10;
@@ -243,6 +249,8 @@ onDone(({ data }) => {
});
});
const notifier = inject<Notifier>("notifier");
onError((error) => {
if (error.message) {
if (error.graphQLErrors && error.graphQLErrors.length > 0) {

40
js/src/views/Admin/Profiles.vue → js/src/views/Admin/ProfilesView.vue
View File

@@ -2,16 +2,18 @@
<div>
<breadcrumbs-nav
:links="[
{ name: RouteName.MODERATION, text: $t('Moderation') },
{ name: RouteName.MODERATION, text: t('Moderation') },
{
name: RouteName.PROFILES,
text: $t('Profiles'),
text: t('Profiles'),
},
]"
/>
<div v-if="persons">
<o-switch v-model="local">{{ $t("Local") }}</o-switch>
<o-switch v-model="suspended">{{ $t("Suspended") }}</o-switch>
<div class="flex gap-2">
<o-switch v-model="local">{{ t("Local") }}</o-switch>
<o-switch v-model="suspended">{{ t("Suspended") }}</o-switch>
</div>
<o-table
:data="persons.elements"
:loading="loading"
@@ -20,25 +22,24 @@
backend-filtering
:debounce-search="200"
v-model:current-page="page"
:aria-next-label="$t('Next page')"
:aria-previous-label="$t('Previous page')"
:aria-page-label="$t('Page')"
:aria-current-label="$t('Current page')"
:aria-next-label="t('Next page')"
:aria-previous-label="t('Previous page')"
:aria-page-label="t('Page')"
:aria-current-label="t('Current page')"
:total="persons.total"
:per-page="PROFILES_PER_PAGE"
@page-change="onPageChange"
@filters-change="onFiltersChange"
>
<o-table-column
field="preferredUsername"
:label="$t('Username')"
:label="t('Username')"
searchable
>
<template #searchable="props">
<o-input
v-model="props.filters.preferredUsername"
:aria-label="$t('Filter')"
:placeholder="$t('Filter')"
:aria-label="t('Filter')"
:placeholder="t('Filter')"
icon="magnify"
/>
</template>
@@ -57,6 +58,7 @@
:alt="props.row.avatar.alt || ''"
width="48"
height="48"
class="rounded-full"
/>
</figure>
<Account v-else :size="48" />
@@ -72,12 +74,12 @@
</template>
</o-table-column>
<o-table-column field="domain" :label="$t('Domain')" searchable>
<o-table-column field="domain" :label="t('Domain')" searchable>
<template #searchable="props">
<o-input
v-model="props.filters.domain"
:aria-label="$t('Filter')"
:placeholder="$t('Filter')"
:aria-label="t('Filter')"
:placeholder="t('Filter')"
icon="magnify"
/>
</template>
@@ -87,7 +89,7 @@
</o-table-column>
<template #empty>
<empty-content icon="account" :inline="true">
{{ $t("No profile matches the filters") }}
{{ t("No profile matches the filters") }}
</empty-content>
</template>
</o-table>
@@ -142,10 +144,6 @@ useHead({
title: computed(() => t("Profiles")),
});
const onPageChange = async (): Promise<void> => {
await fetchMore();
};
const onFiltersChange = ({
preferredUsername: newPreferredUsername,
domain: newDomain,
@@ -155,7 +153,7 @@ const onFiltersChange = ({
}): void => {
preferredUsername.value = newPreferredUsername;
domain.value = newDomain;
fetchMore();
fetchMore({});
};
</script>
<style lang="scss" scoped>

0
js/src/views/Admin/Settings.vue → js/src/views/Admin/SettingsView.vue
View File

0
js/src/views/Admin/Users.vue → js/src/views/Admin/UsersView.vue
View File