fix: various fixes

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2023-11-20 09:35:21 +01:00
parent 3c288c5858
commit b635937091
33 changed files with 579 additions and 129 deletions

View File

@@ -80,7 +80,7 @@
<img
class="w-12"
v-if="instance.hasRelay"
src="../../../public/img/logo.svg"
src="/img/logo.svg"
alt=""
/>
<CloudQuestion v-else :size="36" />

View File

@@ -44,19 +44,28 @@
<script lang="ts" setup>
import RouteName from "../../router/name";
import { useQuery } from "@vue/apollo-composable";
import { computed, defineAsyncComponent, ref } from "vue";
import { computed, defineAsyncComponent, ref, watchEffect } from "vue";
import { useI18n } from "vue-i18n";
import { integerTransformer, useRouteQuery } from "vue-use-route-query";
import {
booleanTransformer,
integerTransformer,
useRouteQuery,
} from "vue-use-route-query";
import { PROFILE_CONVERSATIONS } from "@/graphql/event";
import ConversationListItem from "../../components/Conversations/ConversationListItem.vue";
import EmptyContent from "../../components/Utils/EmptyContent.vue";
import { useHead } from "@vueuse/head";
import { IPerson } from "@/types/actor";
import { useProgrammatic } from "@oruga-ui/oruga-next";
import { arrayTransformer } from "@/utils/route";
const page = useRouteQuery("page", 1, integerTransformer);
const CONVERSATIONS_PER_PAGE = 10;
const showModal = useRouteQuery("newMessage", false, booleanTransformer);
const personMentions = useRouteQuery("personMentions", [], arrayTransformer);
const groupMentions = useRouteQuery("groupMentions", [], arrayTransformer);
const { t } = useI18n({ useScope: "global" });
useHead({
@@ -69,6 +78,7 @@ const { result: conversationsResult } = useQuery<{
loggedPerson: Pick<IPerson, "conversations">;
}>(PROFILE_CONVERSATIONS, () => ({
page: page.value,
limit: CONVERSATIONS_PER_PAGE,
}));
const conversations = computed(
@@ -88,7 +98,17 @@ const NewConversation = defineAsyncComponent(
const openNewMessageModal = () => {
oruga.modal.open({
component: NewConversation,
props: {
personMentions: personMentions.value,
groupMentions: groupMentions.value,
},
trapFocus: true,
});
};
watchEffect(() => {
if (showModal.value) {
openNewMessageModal();
}
});
</script>

View File

@@ -14,13 +14,13 @@
]"
/>
<div
v-if="conversation.event"
class="bg-mbz-yellow p-6 mb-6 rounded flex gap-2 items-center"
v-if="conversation.event && !isCurrentActorAuthor"
class="bg-mbz-yellow p-6 mb-3 rounded flex gap-2 items-center"
>
<Calendar :size="36" />
<i18n-t
tag="p"
keypath="This is a announcement from the organizers of event {event}"
keypath="This is a announcement from the organizers of event {event}. You can't reply to it, but you can send a private message to event organizers."
>
<template #event>
<b>
@@ -35,10 +35,7 @@
</template>
</i18n-t>
</div>
<div
v-if="currentActor && currentActor.id !== conversation.actor?.id"
class="bg-mbz-info p-6 rounded flex gap-2 items-center my-3"
>
<o-notification v-if="isCurrentActorAuthor" variant="info" closable>
<i18n-t
keypath="You have access to this conversation as a member of the {group} group"
tag="p"
@@ -55,7 +52,36 @@
>
</template>
</i18n-t>
</div>
</o-notification>
<o-notification
v-else-if="groupParticipants.length > 0 && !conversation.event"
variant="info"
closable
>
<p>
{{
t(
"The following participants are groups, which means group members are able to reply to this conversation:"
)
}}
</p>
<ul class="list-disc">
<li
v-for="groupParticipant in groupParticipants"
:key="groupParticipant.id"
>
<router-link
:to="{
name: RouteName.GROUP,
params: {
preferredUsername: usernameWithDomain(groupParticipant),
},
}"
><b>{{ displayName(groupParticipant) }}</b></router-link
>
</li>
</ul>
</o-notification>
<o-notification v-if="error" variant="danger">
{{ error }}
</o-notification>
@@ -107,7 +133,7 @@
</form>
<div
v-else-if="conversation.event"
class="bg-mbz-yellow p-6 rounded flex gap-2 items-center mt-6"
class="bg-mbz-yellow p-6 rounded flex gap-2 items-center mt-3"
>
<Calendar :size="36" />
<i18n-t
@@ -239,6 +265,12 @@ const otherParticipants = computed(
) ?? []
);
const groupParticipants = computed(() => {
return otherParticipants.value.filter(
(participant) => participant.type === ActorType.GROUP
);
});
const Editor = defineAsyncComponent(
() => import("../../components/TextEditor.vue")
);
@@ -253,8 +285,15 @@ const title = computed(() =>
})
);
const isCurrentActorAuthor = computed(
() =>
currentActor.value &&
conversation.value &&
currentActor.value.id !== conversation.value?.actor?.id
);
useHead({
title: title.value,
title: () => title.value,
});
const newComment = ref("");

View File

@@ -650,12 +650,6 @@ const FullAddressAutoComplete = defineAsyncComponent(
const { t } = useI18n({ useScope: "global" });
useHead({
title: computed(() =>
props.isUpdate ? t("Event edition") : t("Event creation")
),
});
const props = withDefaults(
defineProps<{
eventId?: undefined | string;
@@ -667,6 +661,12 @@ const props = withDefaults(
const eventId = computed(() => props.eventId);
useHead({
title: computed(() =>
props.isUpdate ? t("Event edition") : t("Event creation")
),
});
const event = ref<IEditableEvent>(new EventModel());
const unmodifiedEvent = ref<IEditableEvent>(new EventModel());

View File

@@ -225,6 +225,7 @@
@click="acceptParticipants(checkedRows)"
variant="success"
:disabled="!canAcceptParticipants"
outlined
>
{{
t(
@@ -238,6 +239,7 @@
@click="refuseParticipants(checkedRows)"
variant="danger"
:disabled="!canRefuseParticipants"
outlined
>
{{
t(

View File

@@ -266,6 +266,21 @@
: t("Deactivate notifications")
}}</span>
</o-button>
<o-button
outlined
tag="router-link"
:to="{
name: RouteName.CONVERSATION_LIST,
query: {
newMessage: 'true',
groupMentions: usernameWithDomain(group),
},
}"
icon-left="email"
v-if="!isCurrentActorAGroupMember || previewPublic"
>
{{ t("Contact") }}
</o-button>
<o-button
outlined
icon-left="share"

View File

@@ -5,19 +5,19 @@
<div class="-z-10 overflow-hidden">
<img
alt=""
src="../../public/img/shape-1.svg"
src="/img/shape-1.svg"
class="-z-10 absolute left-[2%] top-36"
width="300"
/>
<img
alt=""
src="../../public/img/shape-2.svg"
src="/img/shape-2.svg"
class="-z-10 absolute left-[50%] top-[5%] -translate-x-2/4 opacity-60"
width="800"
/>
<img
alt=""
src="../../public/img/shape-3.svg"
src="/img/shape-3.svg"
class="-z-10 absolute top-0 right-36"
width="200"
/>

View File

@@ -749,7 +749,6 @@ import {
useRouteQuery,
enumTransformer,
booleanTransformer,
RouteQueryTransformer,
} from "vue-use-route-query";
import Calendar from "vue-material-design-icons/Calendar.vue";
import AccountMultiple from "vue-material-design-icons/AccountMultiple.vue";
@@ -776,6 +775,7 @@ import lodashSortBy from "lodash/sortBy";
import EmptyContent from "@/components/Utils/EmptyContent.vue";
import SkeletonGroupResultList from "@/components/Group/SkeletonGroupResultList.vue";
import SkeletonEventResultList from "@/components/Event/SkeletonEventResultList.vue";
import { arrayTransformer } from "@/utils/route";
const EventMarkerMap = defineAsyncComponent(
() => import("@/components/Search/EventMarkerMap.vue")
@@ -840,15 +840,6 @@ enum SortValues {
MEMBER_COUNT_DESC = "MEMBER_COUNT_DESC",
}
const arrayTransformer: RouteQueryTransformer<string[]> = {
fromQuery(query: string) {
return query.split(",");
},
toQuery(value: string[]) {
return value.join(",");
},
};
const props = defineProps<{
tag?: string;
}>();