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

Add share link modal and rename some texts

Browse Source
This commit is contained in:
Massedil
2025-11-19 17:57:36 +01:00
committed by setop
parent fe1b8720fb
commit 27f20cfa41
3 changed files with 140 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/i18n/en_US.json
View File

@@ -388,7 +388,7 @@
"Drafts": "Drafts",
"Due on": "Due on",
"Duplicate": "Duplicate",
"Edit invitation": "Edit invitation",
"Edit label": "Edit label",
"Edit post": "Edit post",
"Edit profile {profile}": "Edit profile {profile}",
"Edit user email": "Edit user email",
@@ -623,6 +623,7 @@
"Integrate this event with 3rd-party tools and show metadata for the event.": "Integrate this event with 3rd-party tools and show metadata for the event.",
"Interact with a remote content": "Interact with a remote content",
"Interact": "Interact",
"Invitation URL":"Invitation URL",
"Invitation links": "Invitation links",
"Invitations": "Invitations",
"Invite a new member": "Invite a new member",
@@ -636,6 +637,7 @@
"Join a group": "Join a group",
"Join group {group}": "Join group {group}",
"Join group": "Join group",
"Join my group":"Join my group",
"Join {instance}, a Mobilizon instance": "Join {instance}, a Mobilizon instance",
"Join": "Join",
"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.",
@@ -1093,7 +1095,9 @@
"Set an URL to a page with your own privacy policy.": "Set an URL to a page with your own privacy policy.",
"Set an URL to a page with your own terms.": "Set an URL to a page with your own terms.",
"Settings": "Settings",
"Share link":"Share link",
"Share this event": "Share this event",
"Share this group invitation link":"Share this group invitation link",
"Share this group": "Share this group",
"Share this post": "Share this post",
"Share": "Share",
@@ -1378,7 +1382,7 @@
"Update group posts": "Update group posts",
"Update group resources": "Update group resources",
"Update group": "Update group",
"Update invitation":"Update invitation",
"Update label":"Update label",
"Update my event": "Update my event",
"Update my profile": "Update my profile",
"Update post": "Update post",

8
src/i18n/fr_FR.json
View File

@@ -388,7 +388,7 @@
"Drafts": "Brouillons",
"Due on": "Pr\u00e9vu pour le",
"Duplicate": "Dupliquer",
"Edit invitation": "Modifier l'invitation",
"Edit label": "Modifier le label",
"Edit post": "\u00c9diter le billet",
"Edit profile {profile}": "\u00c9diter le profil {profile}",
"Edit user email": "\u00c9diter l'e-mail de l'utilisateur\u00b7ice",
@@ -623,6 +623,7 @@
"Integrate this event with 3rd-party tools and show metadata for the event.": "Int\u00e9grer cet \u00e9v\u00e9nement avec des outils tiers et afficher des m\u00e9tadonn\u00e9es pour l'\u00e9v\u00e9nement.",
"Interact with a remote content": "Interagir avec un contenu distant",
"Interact": "Interagir",
"Invitation URL":"Lien de l'invitation",
"Invitation links": "Liens d'invitation",
"Invitations" : "Invitations",
"Invite a new member": "Inviter un nouveau membre",
@@ -636,6 +637,7 @@
"Join a group": "Rejoindre un groupe",
"Join group {group}": "Rejoindre le groupe {group}",
"Join group": "Rejoindre le groupe",
"Join my group":"Rejoignez mon groupe",
"Join {instance}, a Mobilizon instance": "Rejoignez {instance}, une instance Mobilizon",
"Join": "Rejoindre",
"Keep the entire conversation about a specific topic together on a single page.": "Rassemblez sur une seule page toute la conversation \u00e0 propos d'un sujet sp\u00e9cifique.",
@@ -1092,7 +1094,9 @@
"Set an URL to a page with your own privacy policy.": "Entrez une URL vers une page web avec votre propre politique de confidentialit\u00e9.",
"Set an URL to a page with your own terms.": "Entrez une URL vers une page web avec vos propres conditions d'utilisation.",
"Settings": "Param\u00e8tres",
"Share link":"Partager le lien",
"Share this event": "Partager l'\u00e9v\u00e9nement",
"Share this group invitation link":"Partager ce lien d'invitation de groupe",
"Share this group": "Partager ce groupe",
"Share this post": "Partager ce billet",
"Share": "Partager",
@@ -1377,7 +1381,7 @@
"Update group posts": "Mettre \u00e0 jour des billets de groupes",
"Update group resources": "Mettre \u00e0 jour des ressources de groupes",
"Update group": "Mettre \u00e0 jour le groupe",
"Update invitation" : "Mettre à jour l'invitation",
"Update label" : "Mettre à jour le label",
"Update my event": "Mettre \u00e0 jour mon \u00e9v\u00e9nement",
"Update my profile": "Mettre \u00e0 jour mon profil",
"Update post": "Mettre \u00e0 jour le billet",

98
src/views/Group/GroupInvitations.vue
View File

@@ -30,14 +30,13 @@
<section class="container mx-auto section">
<h1>{{ t("Invitation links") }}</h1>
<o-field groupedClass="flex-wrap" grouped>
<o-input :placeholder="t('Label')" v-model="createInvitationLabel" />
<o-button
variant="primary"
:loading="createGroupInvitationLoading"
@click="
createGroupInvitation({
groupId: group.id,
label: createInvitationLabel,
label: '',
})
"
>{{ t("New invitation") }}</o-button
@@ -59,7 +58,20 @@
)
}}</o-notification>
</div>
<o-table v-else :data="groupInvitationsResult.listInvitations">
<div v-else>
<o-modal
:close-button-aria-label="t('Close')"
v-model:active="isShareModalActive"
>
<ShareModal
:title="t('Share this group invitation link')"
:text="t('Join my group')"
:url="selectedURL"
:input-label="t('Invitation URL')"
></ShareModal>
</o-modal>
<o-table :data="groupInvitationsResult.listInvitations">
<o-table-column
field="label"
:label="t('Label')"
@@ -81,23 +93,17 @@
>
<o-button
v-if="props.row.token"
tag="router-link"
icon-left="share"
@click="
triggerShare(
invitationUrl(group, props.row.token),
props.row.label
)
"
variant="primary"
:to="{
name: RouteName.GROUP_INVITATION_ACCEPT,
params: {
preferredUsername: group.preferredUsername,
token: props.row.token,
},
}"
>{{ t("Invite link") }}</o-button
>{{ t("Share link") }}</o-button
>
</o-table-column>
<o-table-column
field="creationDate"
:label="t('Creation date')"
sortable
/>
<o-table-column
field="token"
:label="t('Actions')"
@@ -106,34 +112,34 @@
>
<div class="flex gap-1 flex-wrap m-1">
<o-button
class="grow"
variant="primary"
icon-left="pencil"
v-if="updateInvitationToken != props.row.token"
@click="
actionEditGroupInvitation(props.row.token, props.row.label)
"
:loading="updateGroupInvitationLoading"
>{{ t("Edit invitation") }}</o-button
>{{ t("Edit label") }}</o-button
>
<o-button
class="grow"
variant="success"
icon-left="check"
v-if="updateInvitationToken == props.row.token"
@click="actionUpdateGroupInvitation()"
:loading="updateGroupInvitationLoading"
>{{ t("Update invitation") }}</o-button
>{{ t("Update label") }}</o-button
>
<o-button
class="grow"
variant="warning"
icon-left="close"
v-if="updateInvitationToken == props.row.token"
@click="actionCancelEditGroupInvitation()"
:loading="updateGroupInvitationLoading"
>{{ t("Cancel update") }}</o-button
>
<o-button
class="grow"
variant="danger"
icon-left="delete"
v-if="updateInvitationToken != props.row.token"
@click="actionDeleteGroupInvitation(props.row.token)"
:loading="deleteGroupInvitationLoading"
@@ -143,11 +149,13 @@
</o-table-column>
</o-table>
</div>
</div>
</section>
</div>
</template>
<script lang="ts" setup>
import { useRouter } from "vue-router";
import RouteName from "@/router/name";
import {
GROUP_INVITATIONS_LIST,
@@ -163,6 +171,7 @@ import { computed, ref, watch } from "vue";
import { useGroup } from "@/composition/apollo/group";
import { IInvitation } from "@/types/actor/invitation.model";
import { useCurrentActorClient } from "@/composition/apollo/actor";
import ShareModal from "@/components/Share/ShareModal.vue";
const { t } = useI18n({ useScope: "global" });
@@ -206,8 +215,6 @@ watch(currentActor, () => {
// Create invitation
// -------------------------------------------------------------
const createInvitationLabel = ref<string>("");
const {
mutate: createGroupInvitation,
onDone: onCreateGroupInvitationDone,
@@ -218,7 +225,6 @@ const {
onCreateGroupInvitationDone(() => {
// TODO : pas de refetch, mise à jour du cache
groupInvitationsRefetch();
createInvitationLabel.value = "";
});
onCreateGroupInvitationError((error) => {
@@ -293,4 +299,44 @@ const actionDeleteGroupInvitation = (token: string) => {
token: token,
});
};
// -------------------------------------------------------------
// Share invitation
// -------------------------------------------------------------
const router = useRouter();
function invitationUrl(group: IGroup, token: string) {
return (
window.location.origin +
router.resolve({
name: RouteName.GROUP_INVITATION_ACCEPT,
params: {
preferredUsername: group.preferredUsername,
token,
},
}).href
);
}
const isShareModalActive = ref(false);
const selectedLabel = ref("");
const selectedURL = ref("");
const triggerShare = (url: string, label: string): void => {
if (!navigator.share) {
selectedLabel.value = label;
selectedURL.value = url;
isShareModalActive.value = true;
return;
}
navigator
.share({
title: label,
url: url,
})
.then(() => console.debug("Successful share"))
.catch((error: any) => console.debug("Error sharing", error));
};
</script>