Merge branch 'fixes' into 'main'

Various fixes

Closes #1180 et #1182

See merge request framasoft/mobilizon!1317
This commit is contained in:
Thomas Citharel 2022-11-04 07:59:01 +00:00
commit f5e81fab3f
14 changed files with 245 additions and 141 deletions

View file

@ -87,7 +87,7 @@
"vue-router": "4",
"vue-scrollto": "^2.17.1",
"vue-use-route-query": "^1.1.0",
"vuedraggable": "^4.1.0"
"zhyswan-vuedraggable": "^4.1.3"
},
"devDependencies": {
"@histoire/plugin-vue": "^0.11.0",

View file

@ -36,6 +36,9 @@ body {
.btn-size-large {
@apply text-2xl py-6;
}
.btn-size-small {
@apply text-sm py-1 px-2;
}
.btn-disabled {
@apply opacity-50 cursor-not-allowed;
}

View file

@ -1,31 +1,35 @@
<template>
<section>
<section class="bg-white dark:bg-zinc-700 p-2 pt-0.5">
<h1>{{ t("Resources") }}</h1>
<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>
<div class="list-header">
<div class="list-header-right">
<o-checkbox v-model="checkedAll" v-if="resources.length > 0" />
<div class="actions" v-if="validCheckedResources.length > 0">
<small>
{{
$t(
"No resources selected",
{
count: validCheckedResources.length,
},
validCheckedResources.length
)
}}
</small>
<o-button
variant="danger"
icon-right="delete"
size="small"
@click="deleteMultipleResources"
>{{ $t("Delete") }}</o-button
>
</div>
<div class="pl-6 mt-2 flex items-center gap-3">
<o-checkbox v-model="checkedAll" v-if="resources.length > 0">
<span class="sr-only">{{ t("Select all resources") }}</span>
</o-checkbox>
<div
class="flex items-center gap-3"
v-if="validCheckedResources.length > 0"
>
<small>
{{
t(
"No resources selected",
{
count: validCheckedResources.length,
},
validCheckedResources.length
)
}}
</small>
<o-button
variant="danger"
icon-right="delete"
size="small"
@click="deleteMultipleResources"
>{{ t("Delete") }}</o-button
>
</div>
</div>
<draggable
@ -37,12 +41,14 @@
item-key="id"
>
<template #item="{ element }">
<div class="resource-item">
<div class="flex border m-2 p-2 items-center">
<div
class="resource-checkbox px-2"
: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>
<resource-item
:resource="element"
@ -62,21 +68,23 @@
</div>
</template>
</draggable>
<div
class="content has-text-centered has-text-grey"
v-if="resources.length === 0"
>
<p>{{ $t("No resources in this folder") }}</p>
</div>
<EmptyContent icon="link" :inline="true" v-if="resources.length === 0">
{{ t("No resources in this folder") }}
<template #desc>
{{ t("You can add resources by using the button above.") }}
</template>
</EmptyContent>
</section>
</template>
<script lang="ts" setup>
import ResourceItem from "@/components/Resource/ResourceItem.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 Draggable from "vuedraggable";
import Draggable from "zhyswan-vuedraggable";
import { IGroup } from "@/types/actor";
import { useI18n } from "vue-i18n";
import EmptyContent from "@/components/Utils/EmptyContent.vue";
const props = withDefaults(
defineProps<{ resources: IResource[]; isRoot: boolean; group: IGroup }>(),
@ -89,28 +97,20 @@ const emit = defineEmits<{
(e: "delete", resourceID: string): void;
}>();
const { t } = useI18n({ useScope: "global" });
const groupObject: Record<string, unknown> = {
name: "resources",
pull: "clone",
put: true,
};
const checkedResources = ref<{ [key: string]: boolean }>({});
const checkedResources = reactive<{ [key: string]: boolean }>({});
const validCheckedResources = ref<string[]>([]);
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> => {
validCheckedResources.value.forEach((resourceID) => {
emit("delete", resourceID);
@ -120,10 +120,20 @@ const deleteMultipleResources = async (): Promise<void> => {
watch(checkedAll, () => {
props.resources.forEach(({ id }) => {
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) => {
// validCheckedResources.value = validCheckedResources.value.filter(
// (id) => id !== resourceID

View file

@ -26,7 +26,11 @@
:sort="false"
:group="groupObject"
@change="onChange"
/>
>
<template #item="{ element }">
<div>{{ element.name }}</div>
</template>
</draggable>
</router-link>
<resource-dropdown
class="actions"
@ -39,7 +43,7 @@
</template>
<script lang="ts" setup>
import { useRouter } from "vue-router";
import Draggable, { ChangeEvent } from "vuedraggable";
import Draggable from "zhyswan-vuedraggable";
import { IResource } from "@/types/resource";
import RouteName from "@/router/name";
import { IGroup, usernameWithDomain } from "@/types/actor";
@ -75,12 +79,15 @@ const groupObject: Record<string, unknown> = {
put: ["resources"],
};
const onChange = async (evt: ChangeEvent<IResource>) => {
const onChange = async (evt: any) => {
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({
id: props.resource.id,
path: `${props.resource.path}/${props.resource.title}`,
id: movedResource.id,
path: props.resource.path,
parentId: props.resource.id,
});
}

View file

@ -1,34 +1,30 @@
<template>
<div v-if="resource">
<article class="panel is-primary">
<h2 class="panel-heading truncate">
<article class="">
<h2 class="mb-2">
{{
$t('Move "{resourceName}"', { resourceName: initialResource.title })
t('Move "{resourceName}"', { resourceName: initialResource.title })
}}
</h2>
<a
class="panel-block clickable flex gap-1 items-center"
@click="resourcePath.path = resource?.parent?.path"
class="cursor-pointer flex gap-1 items-center border p-2"
@click="goUp()"
v-if="resource.parent"
>
<span class="panel-icon">
<ChevronUp :size="16" />
</span>
{{ $t("Parent folder") }}
<ChevronUp :size="16" />
{{ t("Parent folder") }}
</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 = '/'"
v-else-if="resourcePath?.path && resourcePath?.path.length > 1"
>
<span class="panel-icon">
<ChevronUp :size="16" />
</span>
{{ $t("Parent folder") }}
<ChevronUp :size="16" />
{{ t("Parent folder") }}
</a>
<template v-if="resource.children">
<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"
:class="{
clickable:
@ -38,23 +34,18 @@
@click="goDown(element)"
>
<p class="truncate flex gap-1 items-center">
<span class="panel-icon">
<Folder :size="16" v-if="element.type === 'folder'" />
<Link :size="16" v-else />
</span>
<Folder :size="16" v-if="element.type === 'folder'" />
<Link :size="16" v-else />
<span>{{ element.title }}</span>
</p>
<span v-if="element.id === initialResource.id">
<em v-if="element.type === 'folder'"> {{ $t("(this folder)") }}</em>
<em v-else> {{ $t("(this link)") }}</em>
<em v-if="element.type === 'folder'"> {{ t("(this folder)") }}</em>
<em v-else> {{ t("(this link)") }}</em>
</span>
</a>
</template>
<p
class="panel-block content has-text-grey has-text-centered"
v-if="resource.children && resource.children.total === 0"
>
{{ $t("No resources in this folder") }}
<p class="" v-if="resource.children && resource.children.total === 0">
{{ t("No resources in this folder") }}
</p>
<o-pagination
v-if="resource.children && resource.children.total > RESOURCES_PER_PAGE"
@ -62,25 +53,25 @@
v-model="page"
size="small"
:per-page="RESOURCES_PER_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')"
/>
</article>
<div class="flex gap-2 mt-2">
<o-button variant="text" @click="emit('close-move-modal')">{{
$t("Cancel")
t("Cancel")
}}</o-button>
<o-button
variant="primary"
@click="updateResource"
:disabled="moveDisabled"
><template v-if="resource.path === '/'">
{{ $t("Move resource to the root folder") }}
{{ t("Move resource to the root folder") }}
</template>
<template v-else
>{{ $t("Move resource to {folder}", { folder: resource.title }) }}
>{{ t("Move resource to {folder}", { folder: resource.title }) }}
</template></o-button
>
</div>
@ -88,18 +79,26 @@
</template>
<script lang="ts" setup>
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 { IResource } from "../../types/resource";
import Folder from "vue-material-design-icons/Folder.vue";
import Link from "vue-material-design-icons/Link.vue";
import ChevronUp from "vue-material-design-icons/ChevronUp.vue";
import { useI18n } from "vue-i18n";
const props = defineProps<{ initialResource: IResource; username: string }>();
const emit = defineEmits(["update-resource", "close-move-modal"]);
const resourcePath = ref<{ path: string | undefined; username: string }>({
path: props.initialResource.path,
const { t } = useI18n({ useScope: "global" });
const resourcePath = reactive<{
path: string | undefined;
username: string;
id: string | undefined;
}>({
id: props.initialResource.parent?.id,
path: props.initialResource.parent?.path,
username: props.username,
});
@ -109,9 +108,9 @@ const page = ref(1);
const { result: resourceResult, refetch } = useQuery<{ resource: IResource }>(
GET_RESOURCE,
() => {
if (resourcePath.value?.path) {
if (resourcePath?.path) {
return {
path: resourcePath.value?.path,
path: resourcePath?.path,
username: props.username,
page: page.value,
limit: RESOURCES_PER_PAGE,
@ -125,25 +124,30 @@ const resource = computed(() => resourceResult.value?.resource);
const goDown = (element: IResource): void => {
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, () => {
if (props.initialResource) {
resourcePath.value.path = props.initialResource?.parent?.path;
resourcePath.id = props.initialResource?.parent?.id;
resourcePath.path = props.initialResource?.parent?.path;
refetch();
}
});
const updateResource = (): void => {
console.debug("Emitting updateResource from folder", resourcePath);
const parent = resourcePath?.path === "/" ? null : resourcePath;
emit(
"update-resource",
{
id: props.initialResource.id,
title: props.initialResource.title,
parent: resourcePath.value?.path === "/" ? null : resourcePath.value,
path: props.initialResource.path,
parent: parent,
path: parent?.path ?? "/",
},
props.initialResource.parent
);
@ -152,13 +156,18 @@ const updateResource = (): void => {
const moveDisabled = computed((): boolean | undefined => {
return (
(props.initialResource.parent &&
resourcePath.value &&
props.initialResource.parent.path === resourcePath.value.path) ||
resourcePath &&
props.initialResource.parent.path === resourcePath.path) ||
(props.initialResource.parent === undefined &&
resourcePath.value &&
resourcePath.value.path === "/")
resourcePath &&
resourcePath.path === "/")
);
});
const goUp = () => {
resourcePath.id = resource.value?.parent?.id;
resourcePath.path = resource.value?.parent?.path;
};
</script>
<style lang="scss" scoped>
.panel {

View file

@ -1,5 +1,5 @@
import type { Paginate } from "@/types/paginate";
import type { IActor } from "@/types/actor";
import type { IActor, IGroup } from "@/types/actor";
export interface IResourceMetadata {
title?: string;

View file

@ -81,6 +81,7 @@
newTitle = '';
}
"
outlined
icon-right="close"
:title="t('Cancel discussion title edition')"
/>
@ -237,7 +238,7 @@ subscribeToMore({
const discussion = computed(() => discussionResult.value?.discussion);
const { group } = useGroup(usernameWithDomain(discussion.value?.actor));
const group = computed(() => discussion.value?.actor);
const Editor = defineAsyncComponent(
() => import("@/components/TextEditor.vue")

View file

@ -4,7 +4,7 @@
:links="[
{
name: RouteName.MY_GROUPS,
text: $t('My groups'),
text: t('My groups'),
},
{
name: RouteName.GROUP,
@ -14,14 +14,15 @@
{
name: RouteName.DISCUSSION_LIST,
params: { preferredUsername: usernameWithDomain(group) },
text: $t('Discussions'),
text: t('Discussions'),
},
]"
/>
<section v-if="isCurrentActorAGroupMember">
<h1>{{ t("Discussions") }}</h1>
<p>
{{
$t(
t(
"Keep the entire conversation about a specific topic together on a single page."
)
}}
@ -32,7 +33,7 @@
name: RouteName.CREATE_DISCUSSION,
params: { preferredUsername },
}"
>{{ $t("New discussion") }}</o-button
>{{ t("New discussion") }}</o-button
>
<div v-if="group.discussions.elements.length > 0">
<discussion-list-item
@ -46,25 +47,25 @@
:total="group.discussions.total"
v-model="page"
:per-page="DISCUSSIONS_PER_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')"
>
</o-pagination>
</div>
<empty-content v-else icon="chat">
{{ $t("There's no discussions yet") }}
{{ t("There's no discussions yet") }}
</empty-content>
</section>
<section class="section" v-else-if="!groupLoading && !personLoading">
<empty-content icon="chat">
{{ $t("Only group members can access discussions") }}
{{ t("Only group members can access discussions") }}
<template #desc>
<router-link
:to="{ name: RouteName.GROUP, params: { preferredUsername } }"
>
{{ $t("Return to the group page") }}
{{ t("Return to the group page") }}
</router-link>
</template>
</empty-content>

View file

@ -80,7 +80,7 @@
has-modal-card
:close-button-aria-label="t('Close')"
>
<div class="w-full md:w-[640px]">
<div class="w-full">
<section>
<resource-selector
:initialResource="updatedResource"
@ -138,7 +138,13 @@
{{ modalError }}
</o-notification>
<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
id="new-resource-url"
type="url"
@ -153,7 +159,12 @@
<resource-item :resource="newResource" :preview="true" />
</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
aria-required="true"
v-model="newResource.title"
@ -161,7 +172,12 @@
/>
</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
type="textarea"
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 DraggableList from "@/components/Resource/DraggableList.vue";
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 page = useRouteQuery("page", 1, integerTransformer);
@ -273,6 +292,7 @@ const createLinkResourceModal = ref(false);
const moveModal = ref(false);
const renameModal = ref(false);
const modalError = ref("");
const modalFieldErrors: Record<string, string> = reactive({});
const resourceRenameInput = ref<any>();
const modalNewResourceInput = ref<HTMLElement>();
@ -316,7 +336,14 @@ createResourceDone(() => {
createResourceError((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 = () => {
@ -345,14 +372,22 @@ const {
previewDone(({ data }) => {
if (!data?.previewResourceLink) return;
newResource.title = data?.previewResourceLink.title ?? "";
newResource.summary = data?.previewResourceLink?.description;
newResource.summary = data?.previewResourceLink?.description?.substring(
0,
390
);
newResource.metadata = data?.previewResourceLink;
newResource.type = "link";
});
previewError((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;
} else {
modalError.value = err.graphQLErrors[0].message;
}
});
const previewResource = async (): Promise<void> => {
@ -567,6 +602,9 @@ const updateResource = async (
resourceToUpdate: IResource,
parentPath: string | null = null
): Promise<void> => {
console.debug(
`Update resource « ${resourceToUpdate.title} » at path ${resourceToUpdate.path}`
);
updateResourceMutation(
{
id: resourceToUpdate.id,

View file

@ -6438,13 +6438,6 @@ vue@^3.2.37:
"@vue/server-renderer" "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:
version "2.2.6"
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"
resolved "https://registry.yarnpkg.com/zen-observable/-/zen-observable-0.8.15.tgz#96415c512d8e3ffd920afd3889604e30b9eaac15"
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"

View file

@ -77,16 +77,9 @@ defmodule Mobilizon.Federation.ActivityPub.Transmogrifier do
object_data when is_map(object_data) ->
case Discussions.get_comment_from_url_with_preload(object_data.url) do
{:error, :comment_not_found} ->
object_data = transform_object_data_for_discussion(object_data)
case create_comment_or_discussion(object_data) do
{: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
object_data
|> transform_object_data_for_discussion()
|> save_comment_or_discussion()
{:ok, %Comment{} = comment} ->
# Object already exists
@ -1226,4 +1219,28 @@ defmodule Mobilizon.Federation.ActivityPub.Transmogrifier do
object_id = Utils.get_url(object)
Utils.get_actor(data) == object_id and not Utils.are_same_origin?(object_id, Endpoint.url())
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

View file

@ -120,7 +120,7 @@ defmodule Mobilizon.Resources do
{:ok, resource}
{:error, operation, reason, _changes} ->
Logger.error(
Logger.debug(
"Error while inserting resource when #{operation} because of #{inspect(reason)}"
)

View file

@ -279,7 +279,12 @@ defmodule Mobilizon.Service.ActorSuspension do
{:ok, actor}
{: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))
{:ok, actor}

View file

@ -69,7 +69,11 @@ defmodule Mobilizon.Service.Workers.Notification do
:ok
else
_ -> :ok
%Page{elements: [], total: 0} ->
{:cancel, :no_user_participations}
_ ->
:ok
end
end
@ -103,6 +107,9 @@ defmodule Mobilizon.Service.Workers.Notification do
:ok
else
%Page{elements: [], total: 0} ->
{:cancel, :no_user_participations}
_err ->
:ok
end
@ -125,6 +132,12 @@ defmodule Mobilizon.Service.Workers.Notification do
:ok
else
{:error, :event_not_found} ->
{:cancel, :event_participation_not_found}
%Page{elements: [], total: 0} ->
{:cancel, :no_participants_to_approve}
err ->
Logger.debug(inspect(err))
err