forked from potsda.mn/mobilizon
Merge branch 'fixes' into 'main'
Various fixes Closes #1180 et #1182 See merge request framasoft/mobilizon!1317
This commit is contained in:
commit
f5e81fab3f
|
@ -87,7 +87,7 @@
|
||||||
"vue-router": "4",
|
"vue-router": "4",
|
||||||
"vue-scrollto": "^2.17.1",
|
"vue-scrollto": "^2.17.1",
|
||||||
"vue-use-route-query": "^1.1.0",
|
"vue-use-route-query": "^1.1.0",
|
||||||
"vuedraggable": "^4.1.0"
|
"zhyswan-vuedraggable": "^4.1.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@histoire/plugin-vue": "^0.11.0",
|
"@histoire/plugin-vue": "^0.11.0",
|
||||||
|
|
|
@ -36,6 +36,9 @@ body {
|
||||||
.btn-size-large {
|
.btn-size-large {
|
||||||
@apply text-2xl py-6;
|
@apply text-2xl py-6;
|
||||||
}
|
}
|
||||||
|
.btn-size-small {
|
||||||
|
@apply text-sm py-1 px-2;
|
||||||
|
}
|
||||||
.btn-disabled {
|
.btn-disabled {
|
||||||
@apply opacity-50 cursor-not-allowed;
|
@apply opacity-50 cursor-not-allowed;
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,15 +1,20 @@
|
||||||
<template>
|
<template>
|
||||||
<section>
|
<section class="bg-white dark:bg-zinc-700 p-2 pt-0.5">
|
||||||
|
<h1>{{ t("Resources") }}</h1>
|
||||||
<p v-if="isRoot">
|
<p v-if="isRoot">
|
||||||
{{ $t("A place to store links to documents or resources of any type.") }}
|
{{ t("A place to store links to documents or resources of any type.") }}
|
||||||
</p>
|
</p>
|
||||||
<div class="list-header">
|
<div class="pl-6 mt-2 flex items-center gap-3">
|
||||||
<div class="list-header-right">
|
<o-checkbox v-model="checkedAll" v-if="resources.length > 0">
|
||||||
<o-checkbox v-model="checkedAll" v-if="resources.length > 0" />
|
<span class="sr-only">{{ t("Select all resources") }}</span>
|
||||||
<div class="actions" v-if="validCheckedResources.length > 0">
|
</o-checkbox>
|
||||||
|
<div
|
||||||
|
class="flex items-center gap-3"
|
||||||
|
v-if="validCheckedResources.length > 0"
|
||||||
|
>
|
||||||
<small>
|
<small>
|
||||||
{{
|
{{
|
||||||
$t(
|
t(
|
||||||
"No resources selected",
|
"No resources selected",
|
||||||
{
|
{
|
||||||
count: validCheckedResources.length,
|
count: validCheckedResources.length,
|
||||||
|
@ -23,11 +28,10 @@
|
||||||
icon-right="delete"
|
icon-right="delete"
|
||||||
size="small"
|
size="small"
|
||||||
@click="deleteMultipleResources"
|
@click="deleteMultipleResources"
|
||||||
>{{ $t("Delete") }}</o-button
|
>{{ t("Delete") }}</o-button
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<draggable
|
<draggable
|
||||||
:list="resources"
|
:list="resources"
|
||||||
:sort="false"
|
:sort="false"
|
||||||
|
@ -37,12 +41,14 @@
|
||||||
item-key="id"
|
item-key="id"
|
||||||
>
|
>
|
||||||
<template #item="{ element }">
|
<template #item="{ element }">
|
||||||
<div class="resource-item">
|
<div class="flex border m-2 p-2 items-center">
|
||||||
<div
|
<div
|
||||||
class="resource-checkbox px-2"
|
class="resource-checkbox px-2"
|
||||||
:class="{ checked: checkedResources[element.id as string] }"
|
:class="{ checked: checkedResources[element.id as string] }"
|
||||||
>
|
>
|
||||||
<o-checkbox v-model="checkedResources[element.id as string]" />
|
<o-checkbox v-model="checkedResources[element.id as string]">
|
||||||
|
<span class="sr-only">{{ t("Select this resource") }}</span>
|
||||||
|
</o-checkbox>
|
||||||
</div>
|
</div>
|
||||||
<resource-item
|
<resource-item
|
||||||
:resource="element"
|
:resource="element"
|
||||||
|
@ -62,21 +68,23 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</draggable>
|
</draggable>
|
||||||
<div
|
<EmptyContent icon="link" :inline="true" v-if="resources.length === 0">
|
||||||
class="content has-text-centered has-text-grey"
|
{{ t("No resources in this folder") }}
|
||||||
v-if="resources.length === 0"
|
<template #desc>
|
||||||
>
|
{{ t("You can add resources by using the button above.") }}
|
||||||
<p>{{ $t("No resources in this folder") }}</p>
|
</template>
|
||||||
</div>
|
</EmptyContent>
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import ResourceItem from "@/components/Resource/ResourceItem.vue";
|
import ResourceItem from "@/components/Resource/ResourceItem.vue";
|
||||||
import FolderItem from "@/components/Resource/FolderItem.vue";
|
import FolderItem from "@/components/Resource/FolderItem.vue";
|
||||||
import { ref, watch } from "vue";
|
import { reactive, ref, watch } from "vue";
|
||||||
import { IResource } from "@/types/resource";
|
import { IResource } from "@/types/resource";
|
||||||
import Draggable from "vuedraggable";
|
import Draggable from "zhyswan-vuedraggable";
|
||||||
import { IGroup } from "@/types/actor";
|
import { IGroup } from "@/types/actor";
|
||||||
|
import { useI18n } from "vue-i18n";
|
||||||
|
import EmptyContent from "@/components/Utils/EmptyContent.vue";
|
||||||
|
|
||||||
const props = withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{ resources: IResource[]; isRoot: boolean; group: IGroup }>(),
|
defineProps<{ resources: IResource[]; isRoot: boolean; group: IGroup }>(),
|
||||||
|
@ -89,28 +97,20 @@ const emit = defineEmits<{
|
||||||
(e: "delete", resourceID: string): void;
|
(e: "delete", resourceID: string): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
const { t } = useI18n({ useScope: "global" });
|
||||||
|
|
||||||
const groupObject: Record<string, unknown> = {
|
const groupObject: Record<string, unknown> = {
|
||||||
name: "resources",
|
name: "resources",
|
||||||
pull: "clone",
|
pull: "clone",
|
||||||
put: true,
|
put: true,
|
||||||
};
|
};
|
||||||
|
|
||||||
const checkedResources = ref<{ [key: string]: boolean }>({});
|
const checkedResources = reactive<{ [key: string]: boolean }>({});
|
||||||
|
|
||||||
const validCheckedResources = ref<string[]>([]);
|
const validCheckedResources = ref<string[]>([]);
|
||||||
|
|
||||||
const checkedAll = ref(false);
|
const checkedAll = ref(false);
|
||||||
|
|
||||||
watch(checkedResources, () => {
|
|
||||||
const newValidCheckedResources: string[] = [];
|
|
||||||
Object.entries(checkedResources).forEach(([key, value]) => {
|
|
||||||
if (value) {
|
|
||||||
newValidCheckedResources.push(key);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
validCheckedResources.value = newValidCheckedResources;
|
|
||||||
});
|
|
||||||
|
|
||||||
const deleteMultipleResources = async (): Promise<void> => {
|
const deleteMultipleResources = async (): Promise<void> => {
|
||||||
validCheckedResources.value.forEach((resourceID) => {
|
validCheckedResources.value.forEach((resourceID) => {
|
||||||
emit("delete", resourceID);
|
emit("delete", resourceID);
|
||||||
|
@ -120,10 +120,20 @@ const deleteMultipleResources = async (): Promise<void> => {
|
||||||
watch(checkedAll, () => {
|
watch(checkedAll, () => {
|
||||||
props.resources.forEach(({ id }) => {
|
props.resources.forEach(({ id }) => {
|
||||||
if (!id) return;
|
if (!id) return;
|
||||||
checkedResources.value[id] = checkedAll.value;
|
checkedResources[id] = checkedAll.value;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
watch(checkedResources, (newCheckedResources) => {
|
||||||
|
const newValidCheckedResources: string[] = [];
|
||||||
|
Object.entries(newCheckedResources).forEach(([key, value]) => {
|
||||||
|
if (value) {
|
||||||
|
newValidCheckedResources.push(key);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
validCheckedResources.value = newValidCheckedResources;
|
||||||
|
});
|
||||||
|
|
||||||
// const deleteResource = (resourceID: string) => {
|
// const deleteResource = (resourceID: string) => {
|
||||||
// validCheckedResources.value = validCheckedResources.value.filter(
|
// validCheckedResources.value = validCheckedResources.value.filter(
|
||||||
// (id) => id !== resourceID
|
// (id) => id !== resourceID
|
||||||
|
|
|
@ -26,7 +26,11 @@
|
||||||
:sort="false"
|
:sort="false"
|
||||||
:group="groupObject"
|
:group="groupObject"
|
||||||
@change="onChange"
|
@change="onChange"
|
||||||
/>
|
>
|
||||||
|
<template #item="{ element }">
|
||||||
|
<div>{{ element.name }}</div>
|
||||||
|
</template>
|
||||||
|
</draggable>
|
||||||
</router-link>
|
</router-link>
|
||||||
<resource-dropdown
|
<resource-dropdown
|
||||||
class="actions"
|
class="actions"
|
||||||
|
@ -39,7 +43,7 @@
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { useRouter } from "vue-router";
|
import { useRouter } from "vue-router";
|
||||||
import Draggable, { ChangeEvent } from "vuedraggable";
|
import Draggable from "zhyswan-vuedraggable";
|
||||||
import { IResource } from "@/types/resource";
|
import { IResource } from "@/types/resource";
|
||||||
import RouteName from "@/router/name";
|
import RouteName from "@/router/name";
|
||||||
import { IGroup, usernameWithDomain } from "@/types/actor";
|
import { IGroup, usernameWithDomain } from "@/types/actor";
|
||||||
|
@ -75,12 +79,15 @@ const groupObject: Record<string, unknown> = {
|
||||||
put: ["resources"],
|
put: ["resources"],
|
||||||
};
|
};
|
||||||
|
|
||||||
const onChange = async (evt: ChangeEvent<IResource>) => {
|
const onChange = async (evt: any) => {
|
||||||
if (evt.added && evt.added.element) {
|
if (evt.added && evt.added.element) {
|
||||||
// const movedResource = evt.added.element as IResource;
|
const movedResource = evt.added.element as IResource;
|
||||||
|
console.debug(
|
||||||
|
`Moving resource « ${movedResource.title} » to path « ${props.resource.path} » (new parent ${props.resource.id})`
|
||||||
|
);
|
||||||
moveResource({
|
moveResource({
|
||||||
id: props.resource.id,
|
id: movedResource.id,
|
||||||
path: `${props.resource.path}/${props.resource.title}`,
|
path: props.resource.path,
|
||||||
parentId: props.resource.id,
|
parentId: props.resource.id,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,34 +1,30 @@
|
||||||
<template>
|
<template>
|
||||||
<div v-if="resource">
|
<div v-if="resource">
|
||||||
<article class="panel is-primary">
|
<article class="">
|
||||||
<h2 class="panel-heading truncate">
|
<h2 class="mb-2">
|
||||||
{{
|
{{
|
||||||
$t('Move "{resourceName}"', { resourceName: initialResource.title })
|
t('Move "{resourceName}"', { resourceName: initialResource.title })
|
||||||
}}
|
}}
|
||||||
</h2>
|
</h2>
|
||||||
<a
|
<a
|
||||||
class="panel-block clickable flex gap-1 items-center"
|
class="cursor-pointer flex gap-1 items-center border p-2"
|
||||||
@click="resourcePath.path = resource?.parent?.path"
|
@click="goUp()"
|
||||||
v-if="resource.parent"
|
v-if="resource.parent"
|
||||||
>
|
>
|
||||||
<span class="panel-icon">
|
|
||||||
<ChevronUp :size="16" />
|
<ChevronUp :size="16" />
|
||||||
</span>
|
{{ t("Parent folder") }}
|
||||||
{{ $t("Parent folder") }}
|
|
||||||
</a>
|
</a>
|
||||||
<a
|
<a
|
||||||
class="panel-block clickable flex gap-1 items-center"
|
class="cursor-pointer flex gap-1 items-center border p-2"
|
||||||
@click="resourcePath.path = '/'"
|
@click="resourcePath.path = '/'"
|
||||||
v-else-if="resourcePath?.path && resourcePath?.path.length > 1"
|
v-else-if="resourcePath?.path && resourcePath?.path.length > 1"
|
||||||
>
|
>
|
||||||
<span class="panel-icon">
|
|
||||||
<ChevronUp :size="16" />
|
<ChevronUp :size="16" />
|
||||||
</span>
|
{{ t("Parent folder") }}
|
||||||
{{ $t("Parent folder") }}
|
|
||||||
</a>
|
</a>
|
||||||
<template v-if="resource.children">
|
<template v-if="resource.children">
|
||||||
<a
|
<a
|
||||||
class="panel-block flex flex-wrap gap-1 px-2"
|
class="cursor-pointer flex flex-wrap gap-1 p-2 border"
|
||||||
v-for="element in resource.children.elements"
|
v-for="element in resource.children.elements"
|
||||||
:class="{
|
:class="{
|
||||||
clickable:
|
clickable:
|
||||||
|
@ -38,23 +34,18 @@
|
||||||
@click="goDown(element)"
|
@click="goDown(element)"
|
||||||
>
|
>
|
||||||
<p class="truncate flex gap-1 items-center">
|
<p class="truncate flex gap-1 items-center">
|
||||||
<span class="panel-icon">
|
|
||||||
<Folder :size="16" v-if="element.type === 'folder'" />
|
<Folder :size="16" v-if="element.type === 'folder'" />
|
||||||
<Link :size="16" v-else />
|
<Link :size="16" v-else />
|
||||||
</span>
|
|
||||||
<span>{{ element.title }}</span>
|
<span>{{ element.title }}</span>
|
||||||
</p>
|
</p>
|
||||||
<span v-if="element.id === initialResource.id">
|
<span v-if="element.id === initialResource.id">
|
||||||
<em v-if="element.type === 'folder'"> {{ $t("(this folder)") }}</em>
|
<em v-if="element.type === 'folder'"> {{ t("(this folder)") }}</em>
|
||||||
<em v-else> {{ $t("(this link)") }}</em>
|
<em v-else> {{ t("(this link)") }}</em>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
</template>
|
</template>
|
||||||
<p
|
<p class="" v-if="resource.children && resource.children.total === 0">
|
||||||
class="panel-block content has-text-grey has-text-centered"
|
{{ t("No resources in this folder") }}
|
||||||
v-if="resource.children && resource.children.total === 0"
|
|
||||||
>
|
|
||||||
{{ $t("No resources in this folder") }}
|
|
||||||
</p>
|
</p>
|
||||||
<o-pagination
|
<o-pagination
|
||||||
v-if="resource.children && resource.children.total > RESOURCES_PER_PAGE"
|
v-if="resource.children && resource.children.total > RESOURCES_PER_PAGE"
|
||||||
|
@ -62,25 +53,25 @@
|
||||||
v-model="page"
|
v-model="page"
|
||||||
size="small"
|
size="small"
|
||||||
:per-page="RESOURCES_PER_PAGE"
|
:per-page="RESOURCES_PER_PAGE"
|
||||||
:aria-next-label="$t('Next page')"
|
:aria-next-label="t('Next page')"
|
||||||
:aria-previous-label="$t('Previous page')"
|
:aria-previous-label="t('Previous page')"
|
||||||
:aria-page-label="$t('Page')"
|
:aria-page-label="t('Page')"
|
||||||
:aria-current-label="$t('Current page')"
|
:aria-current-label="t('Current page')"
|
||||||
/>
|
/>
|
||||||
</article>
|
</article>
|
||||||
<div class="flex gap-2 mt-2">
|
<div class="flex gap-2 mt-2">
|
||||||
<o-button variant="text" @click="emit('close-move-modal')">{{
|
<o-button variant="text" @click="emit('close-move-modal')">{{
|
||||||
$t("Cancel")
|
t("Cancel")
|
||||||
}}</o-button>
|
}}</o-button>
|
||||||
<o-button
|
<o-button
|
||||||
variant="primary"
|
variant="primary"
|
||||||
@click="updateResource"
|
@click="updateResource"
|
||||||
:disabled="moveDisabled"
|
:disabled="moveDisabled"
|
||||||
><template v-if="resource.path === '/'">
|
><template v-if="resource.path === '/'">
|
||||||
{{ $t("Move resource to the root folder") }}
|
{{ t("Move resource to the root folder") }}
|
||||||
</template>
|
</template>
|
||||||
<template v-else
|
<template v-else
|
||||||
>{{ $t("Move resource to {folder}", { folder: resource.title }) }}
|
>{{ t("Move resource to {folder}", { folder: resource.title }) }}
|
||||||
</template></o-button
|
</template></o-button
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
|
@ -88,18 +79,26 @@
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { useQuery } from "@vue/apollo-composable";
|
import { useQuery } from "@vue/apollo-composable";
|
||||||
import { computed, ref, watch } from "vue";
|
import { computed, reactive, ref, watch } from "vue";
|
||||||
import { GET_RESOURCE } from "../../graphql/resources";
|
import { GET_RESOURCE } from "../../graphql/resources";
|
||||||
import { IResource } from "../../types/resource";
|
import { IResource } from "../../types/resource";
|
||||||
import Folder from "vue-material-design-icons/Folder.vue";
|
import Folder from "vue-material-design-icons/Folder.vue";
|
||||||
import Link from "vue-material-design-icons/Link.vue";
|
import Link from "vue-material-design-icons/Link.vue";
|
||||||
import ChevronUp from "vue-material-design-icons/ChevronUp.vue";
|
import ChevronUp from "vue-material-design-icons/ChevronUp.vue";
|
||||||
|
import { useI18n } from "vue-i18n";
|
||||||
|
|
||||||
const props = defineProps<{ initialResource: IResource; username: string }>();
|
const props = defineProps<{ initialResource: IResource; username: string }>();
|
||||||
const emit = defineEmits(["update-resource", "close-move-modal"]);
|
const emit = defineEmits(["update-resource", "close-move-modal"]);
|
||||||
|
|
||||||
const resourcePath = ref<{ path: string | undefined; username: string }>({
|
const { t } = useI18n({ useScope: "global" });
|
||||||
path: props.initialResource.path,
|
|
||||||
|
const resourcePath = reactive<{
|
||||||
|
path: string | undefined;
|
||||||
|
username: string;
|
||||||
|
id: string | undefined;
|
||||||
|
}>({
|
||||||
|
id: props.initialResource.parent?.id,
|
||||||
|
path: props.initialResource.parent?.path,
|
||||||
username: props.username,
|
username: props.username,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -109,9 +108,9 @@ const page = ref(1);
|
||||||
const { result: resourceResult, refetch } = useQuery<{ resource: IResource }>(
|
const { result: resourceResult, refetch } = useQuery<{ resource: IResource }>(
|
||||||
GET_RESOURCE,
|
GET_RESOURCE,
|
||||||
() => {
|
() => {
|
||||||
if (resourcePath.value?.path) {
|
if (resourcePath?.path) {
|
||||||
return {
|
return {
|
||||||
path: resourcePath.value?.path,
|
path: resourcePath?.path,
|
||||||
username: props.username,
|
username: props.username,
|
||||||
page: page.value,
|
page: page.value,
|
||||||
limit: RESOURCES_PER_PAGE,
|
limit: RESOURCES_PER_PAGE,
|
||||||
|
@ -125,25 +124,30 @@ const resource = computed(() => resourceResult.value?.resource);
|
||||||
|
|
||||||
const goDown = (element: IResource): void => {
|
const goDown = (element: IResource): void => {
|
||||||
if (element.type === "folder" && element.id !== props.initialResource.id) {
|
if (element.type === "folder" && element.id !== props.initialResource.id) {
|
||||||
resourcePath.value.path = element.path;
|
resourcePath.id = element.id;
|
||||||
|
resourcePath.path = element.path;
|
||||||
|
console.debug("Gone into folder", resourcePath);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
watch(props.initialResource, () => {
|
watch(props.initialResource, () => {
|
||||||
if (props.initialResource) {
|
if (props.initialResource) {
|
||||||
resourcePath.value.path = props.initialResource?.parent?.path;
|
resourcePath.id = props.initialResource?.parent?.id;
|
||||||
|
resourcePath.path = props.initialResource?.parent?.path;
|
||||||
refetch();
|
refetch();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const updateResource = (): void => {
|
const updateResource = (): void => {
|
||||||
|
console.debug("Emitting updateResource from folder", resourcePath);
|
||||||
|
const parent = resourcePath?.path === "/" ? null : resourcePath;
|
||||||
emit(
|
emit(
|
||||||
"update-resource",
|
"update-resource",
|
||||||
{
|
{
|
||||||
id: props.initialResource.id,
|
id: props.initialResource.id,
|
||||||
title: props.initialResource.title,
|
title: props.initialResource.title,
|
||||||
parent: resourcePath.value?.path === "/" ? null : resourcePath.value,
|
parent: parent,
|
||||||
path: props.initialResource.path,
|
path: parent?.path ?? "/",
|
||||||
},
|
},
|
||||||
props.initialResource.parent
|
props.initialResource.parent
|
||||||
);
|
);
|
||||||
|
@ -152,13 +156,18 @@ const updateResource = (): void => {
|
||||||
const moveDisabled = computed((): boolean | undefined => {
|
const moveDisabled = computed((): boolean | undefined => {
|
||||||
return (
|
return (
|
||||||
(props.initialResource.parent &&
|
(props.initialResource.parent &&
|
||||||
resourcePath.value &&
|
resourcePath &&
|
||||||
props.initialResource.parent.path === resourcePath.value.path) ||
|
props.initialResource.parent.path === resourcePath.path) ||
|
||||||
(props.initialResource.parent === undefined &&
|
(props.initialResource.parent === undefined &&
|
||||||
resourcePath.value &&
|
resourcePath &&
|
||||||
resourcePath.value.path === "/")
|
resourcePath.path === "/")
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const goUp = () => {
|
||||||
|
resourcePath.id = resource.value?.parent?.id;
|
||||||
|
resourcePath.path = resource.value?.parent?.path;
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.panel {
|
.panel {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import type { Paginate } from "@/types/paginate";
|
import type { Paginate } from "@/types/paginate";
|
||||||
import type { IActor } from "@/types/actor";
|
import type { IActor, IGroup } from "@/types/actor";
|
||||||
|
|
||||||
export interface IResourceMetadata {
|
export interface IResourceMetadata {
|
||||||
title?: string;
|
title?: string;
|
||||||
|
|
|
@ -81,6 +81,7 @@
|
||||||
newTitle = '';
|
newTitle = '';
|
||||||
}
|
}
|
||||||
"
|
"
|
||||||
|
outlined
|
||||||
icon-right="close"
|
icon-right="close"
|
||||||
:title="t('Cancel discussion title edition')"
|
:title="t('Cancel discussion title edition')"
|
||||||
/>
|
/>
|
||||||
|
@ -237,7 +238,7 @@ subscribeToMore({
|
||||||
|
|
||||||
const discussion = computed(() => discussionResult.value?.discussion);
|
const discussion = computed(() => discussionResult.value?.discussion);
|
||||||
|
|
||||||
const { group } = useGroup(usernameWithDomain(discussion.value?.actor));
|
const group = computed(() => discussion.value?.actor);
|
||||||
|
|
||||||
const Editor = defineAsyncComponent(
|
const Editor = defineAsyncComponent(
|
||||||
() => import("@/components/TextEditor.vue")
|
() => import("@/components/TextEditor.vue")
|
||||||
|
|
|
@ -4,7 +4,7 @@
|
||||||
:links="[
|
:links="[
|
||||||
{
|
{
|
||||||
name: RouteName.MY_GROUPS,
|
name: RouteName.MY_GROUPS,
|
||||||
text: $t('My groups'),
|
text: t('My groups'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: RouteName.GROUP,
|
name: RouteName.GROUP,
|
||||||
|
@ -14,14 +14,15 @@
|
||||||
{
|
{
|
||||||
name: RouteName.DISCUSSION_LIST,
|
name: RouteName.DISCUSSION_LIST,
|
||||||
params: { preferredUsername: usernameWithDomain(group) },
|
params: { preferredUsername: usernameWithDomain(group) },
|
||||||
text: $t('Discussions'),
|
text: t('Discussions'),
|
||||||
},
|
},
|
||||||
]"
|
]"
|
||||||
/>
|
/>
|
||||||
<section v-if="isCurrentActorAGroupMember">
|
<section v-if="isCurrentActorAGroupMember">
|
||||||
|
<h1>{{ t("Discussions") }}</h1>
|
||||||
<p>
|
<p>
|
||||||
{{
|
{{
|
||||||
$t(
|
t(
|
||||||
"Keep the entire conversation about a specific topic together on a single page."
|
"Keep the entire conversation about a specific topic together on a single page."
|
||||||
)
|
)
|
||||||
}}
|
}}
|
||||||
|
@ -32,7 +33,7 @@
|
||||||
name: RouteName.CREATE_DISCUSSION,
|
name: RouteName.CREATE_DISCUSSION,
|
||||||
params: { preferredUsername },
|
params: { preferredUsername },
|
||||||
}"
|
}"
|
||||||
>{{ $t("New discussion") }}</o-button
|
>{{ t("New discussion") }}</o-button
|
||||||
>
|
>
|
||||||
<div v-if="group.discussions.elements.length > 0">
|
<div v-if="group.discussions.elements.length > 0">
|
||||||
<discussion-list-item
|
<discussion-list-item
|
||||||
|
@ -46,25 +47,25 @@
|
||||||
:total="group.discussions.total"
|
:total="group.discussions.total"
|
||||||
v-model="page"
|
v-model="page"
|
||||||
:per-page="DISCUSSIONS_PER_PAGE"
|
:per-page="DISCUSSIONS_PER_PAGE"
|
||||||
:aria-next-label="$t('Next page')"
|
:aria-next-label="t('Next page')"
|
||||||
:aria-previous-label="$t('Previous page')"
|
:aria-previous-label="t('Previous page')"
|
||||||
:aria-page-label="$t('Page')"
|
:aria-page-label="t('Page')"
|
||||||
:aria-current-label="$t('Current page')"
|
:aria-current-label="t('Current page')"
|
||||||
>
|
>
|
||||||
</o-pagination>
|
</o-pagination>
|
||||||
</div>
|
</div>
|
||||||
<empty-content v-else icon="chat">
|
<empty-content v-else icon="chat">
|
||||||
{{ $t("There's no discussions yet") }}
|
{{ t("There's no discussions yet") }}
|
||||||
</empty-content>
|
</empty-content>
|
||||||
</section>
|
</section>
|
||||||
<section class="section" v-else-if="!groupLoading && !personLoading">
|
<section class="section" v-else-if="!groupLoading && !personLoading">
|
||||||
<empty-content icon="chat">
|
<empty-content icon="chat">
|
||||||
{{ $t("Only group members can access discussions") }}
|
{{ t("Only group members can access discussions") }}
|
||||||
<template #desc>
|
<template #desc>
|
||||||
<router-link
|
<router-link
|
||||||
:to="{ name: RouteName.GROUP, params: { preferredUsername } }"
|
:to="{ name: RouteName.GROUP, params: { preferredUsername } }"
|
||||||
>
|
>
|
||||||
{{ $t("Return to the group page") }}
|
{{ t("Return to the group page") }}
|
||||||
</router-link>
|
</router-link>
|
||||||
</template>
|
</template>
|
||||||
</empty-content>
|
</empty-content>
|
||||||
|
|
|
@ -80,7 +80,7 @@
|
||||||
has-modal-card
|
has-modal-card
|
||||||
:close-button-aria-label="t('Close')"
|
:close-button-aria-label="t('Close')"
|
||||||
>
|
>
|
||||||
<div class="w-full md:w-[640px]">
|
<div class="w-full">
|
||||||
<section>
|
<section>
|
||||||
<resource-selector
|
<resource-selector
|
||||||
:initialResource="updatedResource"
|
:initialResource="updatedResource"
|
||||||
|
@ -138,7 +138,13 @@
|
||||||
{{ modalError }}
|
{{ modalError }}
|
||||||
</o-notification>
|
</o-notification>
|
||||||
<form @submit.prevent="createResource">
|
<form @submit.prevent="createResource">
|
||||||
<o-field expanded :label="t('URL')" label-for="new-resource-url">
|
<o-field
|
||||||
|
expanded
|
||||||
|
:label="t('URL')"
|
||||||
|
label-for="new-resource-url"
|
||||||
|
:variant="modalFieldErrors['resource_url'] ? 'danger' : undefined"
|
||||||
|
:message="modalFieldErrors['resource_url']"
|
||||||
|
>
|
||||||
<o-input
|
<o-input
|
||||||
id="new-resource-url"
|
id="new-resource-url"
|
||||||
type="url"
|
type="url"
|
||||||
|
@ -153,7 +159,12 @@
|
||||||
<resource-item :resource="newResource" :preview="true" />
|
<resource-item :resource="newResource" :preview="true" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<o-field :label="t('Title')" label-for="new-resource-link-title">
|
<o-field
|
||||||
|
:label="t('Title')"
|
||||||
|
label-for="new-resource-link-title"
|
||||||
|
:variant="modalFieldErrors['title'] ? 'danger' : undefined"
|
||||||
|
:message="modalFieldErrors['title']"
|
||||||
|
>
|
||||||
<o-input
|
<o-input
|
||||||
aria-required="true"
|
aria-required="true"
|
||||||
v-model="newResource.title"
|
v-model="newResource.title"
|
||||||
|
@ -161,7 +172,12 @@
|
||||||
/>
|
/>
|
||||||
</o-field>
|
</o-field>
|
||||||
|
|
||||||
<o-field :label="t('Description')" label-for="new-resource-summary">
|
<o-field
|
||||||
|
:label="t('Description')"
|
||||||
|
label-for="new-resource-summary"
|
||||||
|
:variant="modalFieldErrors['summary'] ? 'danger' : undefined"
|
||||||
|
:message="modalFieldErrors['summary']"
|
||||||
|
>
|
||||||
<o-input
|
<o-input
|
||||||
type="textarea"
|
type="textarea"
|
||||||
v-model="newResource.summary"
|
v-model="newResource.summary"
|
||||||
|
@ -212,7 +228,10 @@ import Folder from "vue-material-design-icons/Folder.vue";
|
||||||
import Link from "vue-material-design-icons/Link.vue";
|
import Link from "vue-material-design-icons/Link.vue";
|
||||||
import DraggableList from "@/components/Resource/DraggableList.vue";
|
import DraggableList from "@/components/Resource/DraggableList.vue";
|
||||||
import { resourcePathArray } from "@/components/Resource/utils";
|
import { resourcePathArray } from "@/components/Resource/utils";
|
||||||
import { AbsintheGraphQLErrors } from "@/types/errors.model";
|
import {
|
||||||
|
AbsintheGraphQLError,
|
||||||
|
AbsintheGraphQLErrors,
|
||||||
|
} from "@/types/errors.model";
|
||||||
|
|
||||||
const RESOURCES_PER_PAGE = 10;
|
const RESOURCES_PER_PAGE = 10;
|
||||||
const page = useRouteQuery("page", 1, integerTransformer);
|
const page = useRouteQuery("page", 1, integerTransformer);
|
||||||
|
@ -273,6 +292,7 @@ const createLinkResourceModal = ref(false);
|
||||||
const moveModal = ref(false);
|
const moveModal = ref(false);
|
||||||
const renameModal = ref(false);
|
const renameModal = ref(false);
|
||||||
const modalError = ref("");
|
const modalError = ref("");
|
||||||
|
const modalFieldErrors: Record<string, string> = reactive({});
|
||||||
|
|
||||||
const resourceRenameInput = ref<any>();
|
const resourceRenameInput = ref<any>();
|
||||||
const modalNewResourceInput = ref<HTMLElement>();
|
const modalNewResourceInput = ref<HTMLElement>();
|
||||||
|
@ -316,7 +336,14 @@ createResourceDone(() => {
|
||||||
|
|
||||||
createResourceError((err) => {
|
createResourceError((err) => {
|
||||||
console.error(err);
|
console.error(err);
|
||||||
modalError.value = err.graphQLErrors[0].message;
|
const error = err.graphQLErrors[0] as AbsintheGraphQLError;
|
||||||
|
if (error.field) {
|
||||||
|
modalFieldErrors[error.field] = (error.message as unknown as string[]).join(
|
||||||
|
","
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
modalError.value = (error.message as unknown as string[]).join(",");
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const createResource = () => {
|
const createResource = () => {
|
||||||
|
@ -345,14 +372,22 @@ const {
|
||||||
previewDone(({ data }) => {
|
previewDone(({ data }) => {
|
||||||
if (!data?.previewResourceLink) return;
|
if (!data?.previewResourceLink) return;
|
||||||
newResource.title = data?.previewResourceLink.title ?? "";
|
newResource.title = data?.previewResourceLink.title ?? "";
|
||||||
newResource.summary = data?.previewResourceLink?.description;
|
newResource.summary = data?.previewResourceLink?.description?.substring(
|
||||||
|
0,
|
||||||
|
390
|
||||||
|
);
|
||||||
newResource.metadata = data?.previewResourceLink;
|
newResource.metadata = data?.previewResourceLink;
|
||||||
newResource.type = "link";
|
newResource.type = "link";
|
||||||
});
|
});
|
||||||
|
|
||||||
previewError((err) => {
|
previewError((err) => {
|
||||||
console.error(err);
|
console.error(err);
|
||||||
|
const error = err.graphQLErrors[0] as AbsintheGraphQLError;
|
||||||
|
if (error.field) {
|
||||||
|
modalFieldErrors[error.field] = error.message;
|
||||||
|
} else {
|
||||||
modalError.value = err.graphQLErrors[0].message;
|
modalError.value = err.graphQLErrors[0].message;
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const previewResource = async (): Promise<void> => {
|
const previewResource = async (): Promise<void> => {
|
||||||
|
@ -567,6 +602,9 @@ const updateResource = async (
|
||||||
resourceToUpdate: IResource,
|
resourceToUpdate: IResource,
|
||||||
parentPath: string | null = null
|
parentPath: string | null = null
|
||||||
): Promise<void> => {
|
): Promise<void> => {
|
||||||
|
console.debug(
|
||||||
|
`Update resource « ${resourceToUpdate.title} » at path ${resourceToUpdate.path}`
|
||||||
|
);
|
||||||
updateResourceMutation(
|
updateResourceMutation(
|
||||||
{
|
{
|
||||||
id: resourceToUpdate.id,
|
id: resourceToUpdate.id,
|
||||||
|
|
14
js/yarn.lock
14
js/yarn.lock
|
@ -6438,13 +6438,6 @@ vue@^3.2.37:
|
||||||
"@vue/server-renderer" "3.2.41"
|
"@vue/server-renderer" "3.2.41"
|
||||||
"@vue/shared" "3.2.41"
|
"@vue/shared" "3.2.41"
|
||||||
|
|
||||||
vuedraggable@^4.1.0:
|
|
||||||
version "4.1.0"
|
|
||||||
resolved "https://registry.yarnpkg.com/vuedraggable/-/vuedraggable-4.1.0.tgz#edece68adb8a4d9e06accff9dfc9040e66852270"
|
|
||||||
integrity sha512-FU5HCWBmsf20GpP3eudURW3WdWTKIbEIQxh9/8GE806hydR9qZqRRxRE3RjqX7PkuLuMQG/A7n3cfj9rCEchww==
|
|
||||||
dependencies:
|
|
||||||
sortablejs "1.14.0"
|
|
||||||
|
|
||||||
w3c-keyname@^2.2.0, w3c-keyname@^2.2.4:
|
w3c-keyname@^2.2.0, w3c-keyname@^2.2.4:
|
||||||
version "2.2.6"
|
version "2.2.6"
|
||||||
resolved "https://registry.yarnpkg.com/w3c-keyname/-/w3c-keyname-2.2.6.tgz#8412046116bc16c5d73d4e612053ea10a189c85f"
|
resolved "https://registry.yarnpkg.com/w3c-keyname/-/w3c-keyname-2.2.6.tgz#8412046116bc16c5d73d4e612053ea10a189c85f"
|
||||||
|
@ -6804,3 +6797,10 @@ zen-observable@0.8.15, zen-observable@^0.8.0:
|
||||||
version "0.8.15"
|
version "0.8.15"
|
||||||
resolved "https://registry.yarnpkg.com/zen-observable/-/zen-observable-0.8.15.tgz#96415c512d8e3ffd920afd3889604e30b9eaac15"
|
resolved "https://registry.yarnpkg.com/zen-observable/-/zen-observable-0.8.15.tgz#96415c512d8e3ffd920afd3889604e30b9eaac15"
|
||||||
integrity sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ==
|
integrity sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ==
|
||||||
|
|
||||||
|
zhyswan-vuedraggable@^4.1.3:
|
||||||
|
version "4.1.3"
|
||||||
|
resolved "https://registry.yarnpkg.com/zhyswan-vuedraggable/-/zhyswan-vuedraggable-4.1.3.tgz#0304bbf5c676f355e6052919c531802976492993"
|
||||||
|
integrity sha512-q4Mp52tQIvTAWG0CKxLCVLyG/3RnIskDxoJvfjDZ2kM8yTcMkY80VTc8rd3q9KwqJ0UVtjEGLufb23sjDp0peQ==
|
||||||
|
dependencies:
|
||||||
|
sortablejs "1.14.0"
|
||||||
|
|
|
@ -77,16 +77,9 @@ defmodule Mobilizon.Federation.ActivityPub.Transmogrifier do
|
||||||
object_data when is_map(object_data) ->
|
object_data when is_map(object_data) ->
|
||||||
case Discussions.get_comment_from_url_with_preload(object_data.url) do
|
case Discussions.get_comment_from_url_with_preload(object_data.url) do
|
||||||
{:error, :comment_not_found} ->
|
{:error, :comment_not_found} ->
|
||||||
object_data = transform_object_data_for_discussion(object_data)
|
object_data
|
||||||
|
|> transform_object_data_for_discussion()
|
||||||
case create_comment_or_discussion(object_data) do
|
|> save_comment_or_discussion()
|
||||||
{:ok, %Activity{} = activity, entity} ->
|
|
||||||
{:ok, activity, entity}
|
|
||||||
|
|
||||||
{:error, :event_not_allow_commenting} ->
|
|
||||||
Logger.debug("Tried to reply to an event for which comments are closed")
|
|
||||||
:error
|
|
||||||
end
|
|
||||||
|
|
||||||
{:ok, %Comment{} = comment} ->
|
{:ok, %Comment{} = comment} ->
|
||||||
# Object already exists
|
# Object already exists
|
||||||
|
@ -1226,4 +1219,28 @@ defmodule Mobilizon.Federation.ActivityPub.Transmogrifier do
|
||||||
object_id = Utils.get_url(object)
|
object_id = Utils.get_url(object)
|
||||||
Utils.get_actor(data) == object_id and not Utils.are_same_origin?(object_id, Endpoint.url())
|
Utils.get_actor(data) == object_id and not Utils.are_same_origin?(object_id, Endpoint.url())
|
||||||
end
|
end
|
||||||
|
|
||||||
|
@spec save_comment_or_discussion(map()) :: {:ok, Activity.t(), struct()} | :error
|
||||||
|
defp save_comment_or_discussion(object_data) do
|
||||||
|
case create_comment_or_discussion(object_data) do
|
||||||
|
{:ok, %Activity{} = activity, entity} ->
|
||||||
|
{:ok, activity, entity}
|
||||||
|
|
||||||
|
{:error, :entity_tombstoned} ->
|
||||||
|
Logger.debug("Tried to reply to an event that has been tombstoned")
|
||||||
|
:error
|
||||||
|
|
||||||
|
{:error, :event_not_allow_commenting} ->
|
||||||
|
Logger.debug("Tried to reply to an event for which comments are closed")
|
||||||
|
:error
|
||||||
|
|
||||||
|
{:error, %Ecto.Changeset{} = _changeset} ->
|
||||||
|
Logger.debug("Error when saving external comment")
|
||||||
|
:error
|
||||||
|
|
||||||
|
{:error, err} ->
|
||||||
|
Logger.debug("Generic error when saving external comment", err: inspect(err))
|
||||||
|
:error
|
||||||
|
end
|
||||||
|
end
|
||||||
end
|
end
|
||||||
|
|
|
@ -120,7 +120,7 @@ defmodule Mobilizon.Resources do
|
||||||
{:ok, resource}
|
{:ok, resource}
|
||||||
|
|
||||||
{:error, operation, reason, _changes} ->
|
{:error, operation, reason, _changes} ->
|
||||||
Logger.error(
|
Logger.debug(
|
||||||
"Error while inserting resource when #{operation} because of #{inspect(reason)}"
|
"Error while inserting resource when #{operation} because of #{inspect(reason)}"
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
|
@ -279,7 +279,12 @@ defmodule Mobilizon.Service.ActorSuspension do
|
||||||
{:ok, actor}
|
{:ok, actor}
|
||||||
|
|
||||||
{:error, error} ->
|
{:error, error} ->
|
||||||
Logger.error("Error while removing an upload file")
|
Logger.error("Error while removing an upload file",
|
||||||
|
error: inspect(error),
|
||||||
|
actor: Actor.preferred_username_and_domain(actor),
|
||||||
|
file_url: url
|
||||||
|
)
|
||||||
|
|
||||||
Logger.debug(inspect(error))
|
Logger.debug(inspect(error))
|
||||||
|
|
||||||
{:ok, actor}
|
{:ok, actor}
|
||||||
|
|
|
@ -69,7 +69,11 @@ defmodule Mobilizon.Service.Workers.Notification do
|
||||||
|
|
||||||
:ok
|
:ok
|
||||||
else
|
else
|
||||||
_ -> :ok
|
%Page{elements: [], total: 0} ->
|
||||||
|
{:cancel, :no_user_participations}
|
||||||
|
|
||||||
|
_ ->
|
||||||
|
:ok
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
|
@ -103,6 +107,9 @@ defmodule Mobilizon.Service.Workers.Notification do
|
||||||
|
|
||||||
:ok
|
:ok
|
||||||
else
|
else
|
||||||
|
%Page{elements: [], total: 0} ->
|
||||||
|
{:cancel, :no_user_participations}
|
||||||
|
|
||||||
_err ->
|
_err ->
|
||||||
:ok
|
:ok
|
||||||
end
|
end
|
||||||
|
@ -125,6 +132,12 @@ defmodule Mobilizon.Service.Workers.Notification do
|
||||||
|
|
||||||
:ok
|
:ok
|
||||||
else
|
else
|
||||||
|
{:error, :event_not_found} ->
|
||||||
|
{:cancel, :event_participation_not_found}
|
||||||
|
|
||||||
|
%Page{elements: [], total: 0} ->
|
||||||
|
{:cancel, :no_participants_to_approve}
|
||||||
|
|
||||||
err ->
|
err ->
|
||||||
Logger.debug(inspect(err))
|
Logger.debug(inspect(err))
|
||||||
err
|
err
|
||||||
|
|
Loading…
Reference in a new issue