forked from potsda.mn/mobilizon
feat(front): upgrade to Oruga 0.8.x
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
parent
76668e0beb
commit
a9676d6481
14
package-lock.json
generated
14
package-lock.json
generated
|
@ -11,7 +11,8 @@
|
|||
"@apollo/client": "^3.3.16",
|
||||
"@framasoft/socket": "^1.0.0",
|
||||
"@framasoft/socket-apollo-link": "^1.0.0",
|
||||
"@oruga-ui/oruga-next": "^0.7.0",
|
||||
"@oruga-ui/oruga-next": "^0.8.1",
|
||||
"@oruga-ui/theme-oruga": "^0.2.0",
|
||||
"@sentry/tracing": "^7.1",
|
||||
"@sentry/vue": "^7.1",
|
||||
"@tiptap/core": "^2.0.0-beta.41",
|
||||
|
@ -3038,13 +3039,18 @@
|
|||
"dev": true
|
||||
},
|
||||
"node_modules/@oruga-ui/oruga-next": {
|
||||
"version": "0.7.0",
|
||||
"resolved": "https://registry.npmjs.org/@oruga-ui/oruga-next/-/oruga-next-0.7.0.tgz",
|
||||
"integrity": "sha512-T2KnNhGzgqv/Xzu4Efx3wnYahANcP6Z7Yc8DHOFIOLrM+ZDdTS9OjL3gofBVDrDBRg1DQv6EvsSsNkwMR88LpA==",
|
||||
"version": "0.8.1",
|
||||
"resolved": "https://registry.npmjs.org/@oruga-ui/oruga-next/-/oruga-next-0.8.1.tgz",
|
||||
"integrity": "sha512-sdqQEYQ4BTcYWUvgUkzbthO26ZxtJ7W4clE0XKtPLr9MaGuDGU+SKqs7CvpWOrUhfWidiMSjOdGWTQAYzeWASQ==",
|
||||
"peerDependencies": {
|
||||
"vue": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@oruga-ui/theme-oruga": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@oruga-ui/theme-oruga/-/theme-oruga-0.2.0.tgz",
|
||||
"integrity": "sha512-SW5v5cypn+fzBqjcUOY/esv92LOqV6l/Z9QlcaneGQqxyjyapIzuwUdt6oEXpjowqyN90uLYeXYnxltP7uKo0Q=="
|
||||
},
|
||||
"node_modules/@pkgjs/parseargs": {
|
||||
"version": "0.11.0",
|
||||
"resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
|
||||
|
|
|
@ -28,7 +28,8 @@
|
|||
"@apollo/client": "^3.3.16",
|
||||
"@framasoft/socket": "^1.0.0",
|
||||
"@framasoft/socket-apollo-link": "^1.0.0",
|
||||
"@oruga-ui/oruga-next": "^0.7.0",
|
||||
"@oruga-ui/oruga-next": "^0.8.1",
|
||||
"@oruga-ui/theme-oruga": "^0.2.0",
|
||||
"@sentry/tracing": "^7.1",
|
||||
"@sentry/vue": "^7.1",
|
||||
"@tiptap/core": "^2.0.0-beta.41",
|
||||
|
|
|
@ -139,24 +139,31 @@ body {
|
|||
@apply pl-10;
|
||||
}
|
||||
|
||||
/* InputItems */
|
||||
.inputitems-item {
|
||||
/* TagInput */
|
||||
.taginput {
|
||||
@apply rounded bg-white dark:bg-zinc-700;
|
||||
}
|
||||
.taginput-item {
|
||||
@apply bg-primary mr-2;
|
||||
}
|
||||
|
||||
.inputitems-item:first-child {
|
||||
.taginput-item:first-child {
|
||||
@apply ml-2;
|
||||
}
|
||||
|
||||
/* Autocomplete */
|
||||
.autocomplete-menu {
|
||||
@apply max-h-[200px] drop-shadow-md text-black;
|
||||
.autocomplete {
|
||||
@apply max-h-[200px] drop-shadow-md text-black z-10;
|
||||
}
|
||||
|
||||
.autocomplete-item {
|
||||
@apply py-1.5 px-4 text-start;
|
||||
}
|
||||
|
||||
.autocomplete-item-group-title {
|
||||
@apply opacity-50 py-0 px-2;
|
||||
}
|
||||
|
||||
/* Dropdown */
|
||||
.dropdown {
|
||||
@apply inline-flex relative;
|
||||
|
@ -218,6 +225,9 @@ body {
|
|||
}
|
||||
|
||||
/* Radio */
|
||||
.radio {
|
||||
@apply mr-2;
|
||||
}
|
||||
.form-radio {
|
||||
@apply bg-none text-primary accent-primary;
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<o-inputitems
|
||||
<o-taginput
|
||||
:modelValue="modelValueWithDisplayName"
|
||||
@update:modelValue="(val: IActor[]) => $emit('update:modelValue', val)"
|
||||
:data="availableActors"
|
||||
|
@ -8,12 +8,12 @@
|
|||
:open-on-focus="false"
|
||||
field="displayName"
|
||||
:placeholder="t('Add a recipient')"
|
||||
@typing="getActors"
|
||||
@input="getActors"
|
||||
>
|
||||
<template #default="props">
|
||||
<ActorInline :actor="props.option" />
|
||||
</template>
|
||||
</o-inputitems>
|
||||
</o-taginput>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
|
|
@ -235,7 +235,7 @@ import type { Locale } from "date-fns";
|
|||
import ReportModal from "@/components/Report/ReportModal.vue";
|
||||
import { useCreateReport } from "@/composition/apollo/report";
|
||||
import { Snackbar } from "@/plugins/snackbar";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import RouteName from "@/router/name";
|
||||
|
||||
const router = useRouter();
|
||||
|
@ -372,7 +372,7 @@ const reportComment = async (
|
|||
};
|
||||
|
||||
const snackbar = inject<Snackbar>("snackbar");
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
|
||||
onCreateReportError((e) => {
|
||||
isReportModalActive.value = false;
|
||||
|
@ -387,7 +387,7 @@ onCreateReportError((e) => {
|
|||
|
||||
oneCreateReportDone(() => {
|
||||
isReportModalActive.value = false;
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: t("Comment from {'@'}{username} reported", {
|
||||
username: props.comment.actor?.preferredUsername,
|
||||
}),
|
||||
|
|
|
@ -157,7 +157,7 @@ import type { Locale } from "date-fns";
|
|||
import { useI18n } from "vue-i18n";
|
||||
import { useCreateReport } from "@/composition/apollo/report";
|
||||
import { Snackbar } from "@/plugins/snackbar";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import ReportModal from "@/components/Report/ReportModal.vue";
|
||||
|
||||
const Editor = defineAsyncComponent(
|
||||
|
@ -220,7 +220,7 @@ const reportComment = async (
|
|||
};
|
||||
|
||||
const snackbar = inject<Snackbar>("snackbar");
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
|
||||
onCreateReportError((e) => {
|
||||
isReportModalActive.value = false;
|
||||
|
@ -235,7 +235,7 @@ onCreateReportError((e) => {
|
|||
|
||||
oneCreateReportDone(() => {
|
||||
isReportModalActive.value = false;
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: t("Comment from {'@'}{username} reported", {
|
||||
username: props.modelValue.actor?.preferredUsername,
|
||||
}),
|
||||
|
|
|
@ -381,7 +381,7 @@ import { ApolloCache, FetchResult } from "@apollo/client/core";
|
|||
import { useMutation } from "@vue/apollo-composable";
|
||||
import { useCreateReport } from "@/composition/apollo/report";
|
||||
import { useDeleteEvent } from "@/composition/apollo/event";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import ExternalParticipationButton from "./ExternalParticipationButton.vue";
|
||||
import AccountMultiple from "vue-material-design-icons/AccountMultiple.vue";
|
||||
import Bullhorn from "vue-material-design-icons/Bullhorn.vue";
|
||||
|
@ -619,11 +619,11 @@ onJoinEventMutationDone(({ data }) => {
|
|||
}
|
||||
});
|
||||
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
|
||||
onJoinEventMutationError((error) => {
|
||||
if (error.message) {
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: error.message,
|
||||
variant: "danger",
|
||||
position: "bottom-right",
|
||||
|
|
|
@ -10,9 +10,9 @@
|
|||
</div>
|
||||
</div>
|
||||
<o-field
|
||||
grouped
|
||||
:label="$t('Find or add an element')"
|
||||
label-for="event-metadata-autocomplete"
|
||||
class="flex-wrap justify-center gap-2"
|
||||
>
|
||||
<o-autocomplete
|
||||
expanded
|
||||
|
@ -27,6 +27,7 @@
|
|||
id="event-metadata-autocomplete"
|
||||
@select="addElement"
|
||||
dir="auto"
|
||||
class="flex-1 min-w-[200px]"
|
||||
>
|
||||
<template v-slot="props">
|
||||
<div class="dark:bg-violet-3 p-1 flex items-center gap-1">
|
||||
|
|
|
@ -337,7 +337,7 @@ import ViewCompact from "vue-material-design-icons/ViewCompact.vue";
|
|||
import AccountCircle from "vue-material-design-icons/AccountCircle.vue";
|
||||
import AccountGroup from "vue-material-design-icons/AccountGroup.vue";
|
||||
import Video from "vue-material-design-icons/Video.vue";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import { computed, inject } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { Dialog } from "@/plugins/dialog";
|
||||
|
@ -401,7 +401,7 @@ const openDeleteEventModal = (
|
|||
});
|
||||
};
|
||||
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
const snackbar = inject<Snackbar>("snackbar");
|
||||
|
||||
const {
|
||||
|
@ -419,7 +419,7 @@ onDeleteEventDone(() => {
|
|||
*/
|
||||
emit("eventDeleted", props.participation.event.id);
|
||||
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: t("Event {eventTitle} deleted", {
|
||||
eventTitle: props.participation.event.title,
|
||||
}),
|
||||
|
@ -460,7 +460,7 @@ const gotToWithCheck = async (
|
|||
) {
|
||||
const organizerActor = participation.event.organizerActor as IPerson;
|
||||
await changeIdentity(organizerActor);
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: t(
|
||||
"Current identity has been changed to {identityName} in order to manage this event.",
|
||||
{
|
||||
|
|
|
@ -23,9 +23,9 @@
|
|||
:data="addressData"
|
||||
v-model="queryTextWithDefault"
|
||||
:placeholder="placeholderWithDefault"
|
||||
:customFormatter="(elem: IAddress) => addressFullName(elem)"
|
||||
:debounceTyping="debounceDelay"
|
||||
@typing="asyncData"
|
||||
:formatter="(elem: IAddress) => addressFullName(elem)"
|
||||
:debounce="debounceDelay"
|
||||
@input="asyncData"
|
||||
:icon="canShowLocateMeButton ? null : 'map-marker'"
|
||||
expanded
|
||||
@select="setSelected"
|
||||
|
@ -114,30 +114,39 @@
|
|||
required
|
||||
v-model="selected.description"
|
||||
id="addressNameInput"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
<o-field :label="t('Street')" labelFor="streetInput">
|
||||
<o-input v-model="selected.street" id="streetInput" />
|
||||
<o-input v-model="selected.street" id="streetInput" expanded />
|
||||
</o-field>
|
||||
|
||||
<o-field grouped>
|
||||
<o-field :label="t('Postal Code')" labelFor="postalCodeInput">
|
||||
<o-input v-model="selected.postalCode" id="postalCodeInput" />
|
||||
<o-input
|
||||
v-model="selected.postalCode"
|
||||
id="postalCodeInput"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
<o-field :label="t('Locality')" labelFor="localityInput">
|
||||
<o-input v-model="selected.locality" id="localityInput" />
|
||||
<o-input
|
||||
v-model="selected.locality"
|
||||
id="localityInput"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
</o-field>
|
||||
|
||||
<o-field grouped>
|
||||
<o-field :label="t('Region')" labelFor="regionInput">
|
||||
<o-input v-model="selected.region" id="regionInput" />
|
||||
<o-input v-model="selected.region" id="regionInput" expanded />
|
||||
</o-field>
|
||||
|
||||
<o-field :label="t('Country')" labelFor="countryInput">
|
||||
<o-input v-model="selected.country" id="countryInput" />
|
||||
<o-input v-model="selected.country" id="countryInput" expanded />
|
||||
</o-field>
|
||||
</o-field>
|
||||
</section>
|
||||
|
|
|
@ -11,7 +11,7 @@
|
|||
<HelpCircleOutline :size="16" />
|
||||
</o-tooltip>
|
||||
</template>
|
||||
<o-inputitems
|
||||
<o-taginput
|
||||
v-model="tagsStrings"
|
||||
:data="filteredTags"
|
||||
:allow-autocomplete="true"
|
||||
|
@ -21,11 +21,11 @@
|
|||
:maxlength="20"
|
||||
:maxitems="10"
|
||||
:placeholder="$t('Eg: Stockholm, Dance, Chess…')"
|
||||
@typing="debouncedGetFilteredTags"
|
||||
@input="debouncedGetFilteredTags"
|
||||
:id="id"
|
||||
dir="auto"
|
||||
>
|
||||
</o-inputitems>
|
||||
</o-taginput>
|
||||
</o-field>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
|
|
|
@ -17,6 +17,7 @@
|
|||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
maxlength="1024"
|
||||
expanded
|
||||
/>
|
||||
<full-address-auto-complete
|
||||
:resultType="AddressSearchType.ADMINISTRATIVE"
|
||||
|
@ -102,7 +103,7 @@ const submit = () => {
|
|||
const { t } = useI18n({ useScope: "global" });
|
||||
</script>
|
||||
<style scoped>
|
||||
#search-anchor :deep(.o-ctrl-input) {
|
||||
#search-anchor :deep(.o-input__wrapper) {
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -235,7 +235,7 @@ import { useLazyQuery, useMutation } from "@vue/apollo-composable";
|
|||
import { UPDATE_DEFAULT_ACTOR } from "@/graphql/actor";
|
||||
import { changeIdentity } from "@/utils/identity";
|
||||
import { useRegistrationConfig } from "@/composition/apollo/config";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import {
|
||||
UNREAD_ACTOR_CONVERSATIONS,
|
||||
UNREAD_ACTOR_CONVERSATIONS_SUBSCRIPTION,
|
||||
|
@ -350,12 +350,12 @@ onDone(({ data }) => {
|
|||
|
||||
const showMobileMenu = ref(false);
|
||||
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
|
||||
const performLogout = async () => {
|
||||
console.debug("Logging out client...");
|
||||
await logout();
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: t("You have been logged-out"),
|
||||
variant: "success",
|
||||
position: "bottom-right",
|
||||
|
|
|
@ -55,6 +55,7 @@
|
|||
id="additional-comments"
|
||||
autofocus
|
||||
ref="reportAdditionalCommentsInput"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
|
|
@ -13,10 +13,9 @@
|
|||
<o-tooltip
|
||||
:label="t('URL copied to clipboard')"
|
||||
:active="showCopiedTooltip"
|
||||
always
|
||||
variant="success"
|
||||
position="left"
|
||||
>
|
||||
/>
|
||||
<o-button
|
||||
variant="primary"
|
||||
icon-right="content-paste"
|
||||
|
@ -25,7 +24,6 @@
|
|||
@keyup.enter="copyURL"
|
||||
:title="t('Copy URL to clipboard')"
|
||||
/>
|
||||
</o-tooltip>
|
||||
</p>
|
||||
</o-field>
|
||||
<div class="flex flex-wrap gap-1">
|
||||
|
@ -132,7 +130,7 @@ const props = withDefaults(
|
|||
|
||||
const { t } = useI18n({ useScope: "global" });
|
||||
|
||||
const URLInput = ref<{ $refs: { input: HTMLInputElement } } | null>(null);
|
||||
const URLInput = ref<{ $refs: { inputRef: HTMLInputElement } } | null>(null);
|
||||
|
||||
const showCopiedTooltip = ref(false);
|
||||
|
||||
|
@ -162,7 +160,7 @@ const mastodonShare = computed((): string | undefined =>
|
|||
);
|
||||
|
||||
const copyURL = (): void => {
|
||||
URLInput.value?.$refs.input.select();
|
||||
URLInput.value?.$refs.inputRef.select();
|
||||
document.execCommand("copy");
|
||||
showCopiedTooltip.value = true;
|
||||
setTimeout(() => {
|
||||
|
|
|
@ -18,7 +18,7 @@ import { notifierPlugin } from "./plugins/notifier";
|
|||
import FloatingVue from "floating-vue";
|
||||
import "floating-vue/dist/style.css";
|
||||
import Oruga from "@oruga-ui/oruga-next";
|
||||
import "@oruga-ui/oruga-next/dist/oruga.css";
|
||||
import "@oruga-ui/theme-oruga/dist/oruga.css";
|
||||
import "./assets/oruga-tailwindcss.css";
|
||||
import { orugaConfig } from "./oruga-config";
|
||||
import MaterialIcon from "./components/core/MaterialIcon.vue";
|
||||
|
|
|
@ -22,22 +22,24 @@ export const orugaConfig = {
|
|||
roundedClass: "rounded",
|
||||
variantClass: "input-",
|
||||
iconRightClass: "input-icon-right",
|
||||
sizeClass: "input-size-",
|
||||
},
|
||||
inputitems: {
|
||||
itemClass: "inputitems-item",
|
||||
containerClass: "rounded",
|
||||
taginput: {
|
||||
itemClass: "taginput-item",
|
||||
rootClass: "taginput",
|
||||
},
|
||||
autocomplete: {
|
||||
menuClass: "autocomplete-menu",
|
||||
rootClass: "autocomplete",
|
||||
itemClass: "autocomplete-item",
|
||||
itemGroupTitleClass: "autocomplete-item-group-title",
|
||||
},
|
||||
icon: {
|
||||
variantClass: "icon-",
|
||||
},
|
||||
checkbox: {
|
||||
rootClass: "checkbox",
|
||||
checkClass: "checkbox-check",
|
||||
checkCheckedClass: "checkbox-checked",
|
||||
inputClass: "checkbox-check",
|
||||
inputCheckedClass: "checkbox-checked",
|
||||
labelClass: "checkbox-label",
|
||||
},
|
||||
dropdown: {
|
||||
|
@ -62,14 +64,15 @@ export const orugaConfig = {
|
|||
},
|
||||
switch: {
|
||||
labelClass: "switch-label",
|
||||
checkCheckedClass: "switch-check-checked",
|
||||
switchCheckedClass: "switch-check-checked",
|
||||
},
|
||||
select: {
|
||||
selectClass: "select",
|
||||
},
|
||||
radio: {
|
||||
checkCheckedClass: "radio-checked",
|
||||
checkClass: "form-radio",
|
||||
rootClass: "radio",
|
||||
inputCheckedClass: "radio-checked",
|
||||
inputClass: "form-radio",
|
||||
labelClass: "radio-label",
|
||||
},
|
||||
notification: {
|
||||
|
@ -90,8 +93,8 @@ export const orugaConfig = {
|
|||
linkClass: "pagination-link",
|
||||
linkCurrentClass: "pagination-link-current",
|
||||
linkDisabledClass: "pagination-link-disabled",
|
||||
nextBtnClass: "pagination-next",
|
||||
prevBtnClass: "pagination-previous",
|
||||
nextButtonClass: "pagination-next",
|
||||
prevButtonClass: "pagination-previous",
|
||||
ellipsisClass: "pagination-ellipsis",
|
||||
},
|
||||
tabs: {
|
||||
|
@ -99,7 +102,7 @@ export const orugaConfig = {
|
|||
navTabsClass: "tabs-nav",
|
||||
navTypeClass: "tabs-nav-",
|
||||
navSizeClass: "tabs-nav-",
|
||||
tabItemWrapperClass: "tabs-nav-item-wrapper",
|
||||
itemWrapperClass: "tabs-nav-item-wrapper",
|
||||
itemHeaderTypeClass: "tabs-nav-item-",
|
||||
itemHeaderActiveClass: "tabs-nav-item-active-",
|
||||
},
|
||||
|
|
|
@ -26,7 +26,6 @@ export class Notifier {
|
|||
duration: 5000,
|
||||
position: "bottom-right",
|
||||
type,
|
||||
hasIcon: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -28,6 +28,7 @@
|
|||
@input="(event: any) => updateUsername(event.target.value)"
|
||||
id="identity-display-name"
|
||||
dir="auto"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -69,6 +70,7 @@
|
|||
aria-required="false"
|
||||
v-model="identity.summary"
|
||||
id="identity-summary"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -118,10 +120,9 @@
|
|||
<o-tooltip
|
||||
:label="t('URL copied to clipboard')"
|
||||
:active="showCopiedTooltip.atom"
|
||||
always
|
||||
variant="success"
|
||||
position="left"
|
||||
>
|
||||
/>
|
||||
<o-button
|
||||
tag="a"
|
||||
icon-left="rss"
|
||||
|
@ -133,14 +134,12 @@
|
|||
target="_blank"
|
||||
>{{ t("RSS/Atom Feed") }}</o-button
|
||||
>
|
||||
</o-tooltip>
|
||||
<o-tooltip
|
||||
:label="t('URL copied to clipboard')"
|
||||
:active="showCopiedTooltip.ics"
|
||||
always
|
||||
variant="success"
|
||||
position="left"
|
||||
>
|
||||
/>
|
||||
<o-button
|
||||
tag="a"
|
||||
@click="
|
||||
|
@ -152,7 +151,6 @@
|
|||
target="_blank"
|
||||
>{{ t("ICS/WebCal Feed") }}</o-button
|
||||
>
|
||||
</o-tooltip>
|
||||
<o-button
|
||||
icon-left="refresh"
|
||||
variant="text"
|
||||
|
|
|
@ -10,7 +10,11 @@
|
|||
<section v-if="settingsToWrite">
|
||||
<form @submit.prevent="updateSettings">
|
||||
<o-field :label="t('Instance Name')" label-for="instance-name">
|
||||
<o-input v-model="settingsToWrite.instanceName" id="instance-name" />
|
||||
<o-input
|
||||
v-model="settingsToWrite.instanceName"
|
||||
id="instance-name"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<div class="field flex flex-col">
|
||||
<label class="" for="instance-description">{{
|
||||
|
@ -74,7 +78,7 @@
|
|||
<small>
|
||||
{{ t("Main languages you/your moderators speak") }}
|
||||
</small>
|
||||
<o-inputitems
|
||||
<o-taginput
|
||||
v-model="instanceLanguages"
|
||||
:data="filteredLanguages"
|
||||
allow-autocomplete
|
||||
|
@ -82,11 +86,11 @@
|
|||
field="name"
|
||||
icon="label"
|
||||
:placeholder="t('Select languages')"
|
||||
@typing="getFilteredLanguages"
|
||||
@input="getFilteredLanguages"
|
||||
id="instance-languages"
|
||||
>
|
||||
<template #empty>{{ t("No languages found") }}</template>
|
||||
</o-inputitems>
|
||||
</o-taginput>
|
||||
</div>
|
||||
<div class="field flex flex-col">
|
||||
<label class="" for="instance-long-description">{{
|
||||
|
|
|
@ -56,7 +56,7 @@ import ConversationListItem from "../../components/Conversations/ConversationLis
|
|||
import EmptyContent from "../../components/Utils/EmptyContent.vue";
|
||||
import { useHead } from "@unhead/vue";
|
||||
import { IPerson } from "@/types/actor";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import { arrayTransformer } from "@/utils/route";
|
||||
|
||||
const page = useRouteQuery("page", 1, integerTransformer);
|
||||
|
@ -89,14 +89,14 @@ const conversations = computed(
|
|||
}
|
||||
);
|
||||
|
||||
const { oruga } = useProgrammatic();
|
||||
const { modal } = useOruga();
|
||||
|
||||
const NewConversation = defineAsyncComponent(
|
||||
() => import("@/components/Conversations/NewConversation.vue")
|
||||
);
|
||||
|
||||
const openNewMessageModal = () => {
|
||||
oruga.modal.open({
|
||||
modal.open({
|
||||
component: NewConversation,
|
||||
props: {
|
||||
personMentions: personMentions.value,
|
||||
|
|
|
@ -36,6 +36,7 @@
|
|||
<o-input
|
||||
aria-required="true"
|
||||
required
|
||||
expanded
|
||||
v-model="discussion.title"
|
||||
id="discussion-title"
|
||||
/>
|
||||
|
|
|
@ -65,6 +65,7 @@
|
|||
<o-input
|
||||
:value="discussion.title"
|
||||
v-model="newTitle"
|
||||
expanded
|
||||
id="discussion-title"
|
||||
/>
|
||||
</o-field>
|
||||
|
|
|
@ -31,6 +31,7 @@
|
|||
v-model="event.title"
|
||||
id="title"
|
||||
dir="auto"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -72,7 +73,6 @@
|
|||
:locale="$i18n.locale.replace('_', '-')"
|
||||
v-model="beginsOn"
|
||||
horizontal-time-picker
|
||||
editable
|
||||
:tz-offset="tzOffset(beginsOn)"
|
||||
:first-day-of-week="firstDayOfWeek"
|
||||
:datepicker="{
|
||||
|
@ -99,7 +99,6 @@
|
|||
horizontal-time-picker
|
||||
:min-datetime="beginsOn"
|
||||
:tz-offset="tzOffset(endsOn)"
|
||||
editable
|
||||
:first-day-of-week="firstDayOfWeek"
|
||||
:datepicker="{
|
||||
id: 'ends-on-field',
|
||||
|
@ -145,6 +144,7 @@
|
|||
v-model="event.onlineAddress"
|
||||
placeholder="URL"
|
||||
id="website-url"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -373,44 +373,55 @@
|
|||
<o-radio
|
||||
v-model="event.status"
|
||||
name="status"
|
||||
class="mr-2 p-2 rounded border"
|
||||
:class="{
|
||||
'btn-warning': event.status === EventStatus.TENTATIVE,
|
||||
'btn-outlined-warning': event.status !== EventStatus.TENTATIVE,
|
||||
}"
|
||||
variant="warning"
|
||||
:native-value="EventStatus.TENTATIVE"
|
||||
>
|
||||
<div
|
||||
class="mr-2 p-2 rounded border flex gap-x-1"
|
||||
:class="{
|
||||
'btn-warning': event.status === EventStatus.TENTATIVE,
|
||||
'btn-outlined-warning':
|
||||
event.status !== EventStatus.TENTATIVE,
|
||||
}"
|
||||
>
|
||||
<o-icon icon="calendar-question" />
|
||||
{{ t("Tentative: Will be confirmed later") }}
|
||||
</div>
|
||||
</o-radio>
|
||||
<o-radio
|
||||
v-model="event.status"
|
||||
name="status"
|
||||
variant="success"
|
||||
class="mr-2 p-2 rounded border"
|
||||
:native-value="EventStatus.CONFIRMED"
|
||||
>
|
||||
<div
|
||||
class="mr-2 p-2 rounded border flex gap-x-1"
|
||||
:class="{
|
||||
'btn-success': event.status === EventStatus.CONFIRMED,
|
||||
'btn-outlined-success': event.status !== EventStatus.CONFIRMED,
|
||||
'btn-outlined-success':
|
||||
event.status !== EventStatus.CONFIRMED,
|
||||
}"
|
||||
:native-value="EventStatus.CONFIRMED"
|
||||
>
|
||||
<o-icon icon="calendar-check" />
|
||||
{{ t("Confirmed: Will happen") }}
|
||||
</div>
|
||||
</o-radio>
|
||||
<o-radio
|
||||
v-model="event.status"
|
||||
name="status"
|
||||
class="p-2 rounded border"
|
||||
variant="danger"
|
||||
:native-value="EventStatus.CANCELLED"
|
||||
>
|
||||
<div
|
||||
class="p-2 rounded border flex gap-x-1"
|
||||
:class="{
|
||||
'btn-danger': event.status === EventStatus.CANCELLED,
|
||||
'btn-outlined-danger': event.status !== EventStatus.CANCELLED,
|
||||
}"
|
||||
variant="danger"
|
||||
:native-value="EventStatus.CANCELLED"
|
||||
>
|
||||
<o-icon icon="calendar-remove" />
|
||||
{{ t("Cancelled: Won't happen") }}
|
||||
</div>
|
||||
</o-radio>
|
||||
</o-field>
|
||||
</fieldset>
|
||||
|
@ -625,7 +636,7 @@ import { useMutation } from "@vue/apollo-composable";
|
|||
import { Dialog } from "@/plugins/dialog";
|
||||
import { Notifier } from "@/plugins/notifier";
|
||||
import { useHead } from "@unhead/vue";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
import type { Locale } from "date-fns";
|
||||
import sortBy from "lodash/sortBy";
|
||||
import { escapeHtml } from "@/utils/html";
|
||||
|
@ -806,10 +817,10 @@ const {
|
|||
postRefetchQueries(updatedData?.createEvent),
|
||||
}));
|
||||
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
|
||||
onCreateEventMutationDone(async ({ data }) => {
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: (event.value.draft
|
||||
? t("The event has been created as a draft")
|
||||
: t("The event has been published")) as string,
|
||||
|
@ -852,7 +863,7 @@ const {
|
|||
}));
|
||||
|
||||
onEditEventMutationDone(() => {
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: updateEventMessage.value,
|
||||
variant: "success",
|
||||
position: "bottom-right",
|
||||
|
|
|
@ -15,6 +15,7 @@
|
|||
<o-input
|
||||
aria-required="true"
|
||||
required
|
||||
expanded
|
||||
v-model="group.name"
|
||||
id="group-display-name"
|
||||
/>
|
||||
|
|
|
@ -27,7 +27,11 @@
|
|||
>
|
||||
<form @submit.prevent="updateGroup(buildVariables)" v-if="editableGroup">
|
||||
<o-field :label="t('Group name')" label-for="group-settings-name">
|
||||
<o-input v-model="editableGroup.name" id="group-settings-name" />
|
||||
<o-input
|
||||
v-model="editableGroup.name"
|
||||
id="group-settings-name"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<o-field :label="t('Group short description')">
|
||||
<Editor
|
||||
|
@ -83,16 +87,15 @@
|
|||
)
|
||||
}}</small>
|
||||
</o-radio>
|
||||
<p class="pl-6">
|
||||
<p class="pl-6 flex items-center gap-2">
|
||||
<code>{{ group.url }}</code>
|
||||
<o-tooltip
|
||||
v-if="canShowCopyButton"
|
||||
:label="t('URL copied to clipboard')"
|
||||
:active="showCopiedTooltip"
|
||||
always
|
||||
variant="success"
|
||||
position="left"
|
||||
>
|
||||
/>
|
||||
<o-button
|
||||
variant="primary"
|
||||
icon-right="content-paste"
|
||||
|
@ -100,7 +103,6 @@
|
|||
@click="copyURL"
|
||||
@keyup.enter="copyURL"
|
||||
/>
|
||||
</o-tooltip>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -387,6 +387,7 @@
|
|||
<o-input
|
||||
type="textarea"
|
||||
v-model="noteContent"
|
||||
expanded
|
||||
id="newNoteInput"
|
||||
></o-input>
|
||||
</o-field>
|
||||
|
|
|
@ -29,6 +29,7 @@
|
|||
v-model="editablePost.title"
|
||||
id="post-title"
|
||||
dir="auto"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
|
|
@ -100,7 +100,7 @@
|
|||
</div>
|
||||
<o-dropdown position="bottom-left" aria-role="list">
|
||||
<template #trigger>
|
||||
<o-button role="button" icon-right="dots-horizontal">
|
||||
<o-button icon-right="dots-horizontal">
|
||||
{{ t("Actions") }}
|
||||
</o-button>
|
||||
</template>
|
||||
|
|
|
@ -71,6 +71,7 @@
|
|||
ref="resourceRenameInput"
|
||||
aria-required="true"
|
||||
v-model="updatedResource.title"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -133,6 +134,7 @@
|
|||
aria-required="true"
|
||||
v-model="newResource.title"
|
||||
id="new-resource-title"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -167,6 +169,7 @@
|
|||
id="new-resource-url"
|
||||
type="url"
|
||||
required
|
||||
expanded
|
||||
v-model="newResource.resourceUrl"
|
||||
@blur="previewResource"
|
||||
ref="modalNewResourceLinkInput"
|
||||
|
@ -187,6 +190,7 @@
|
|||
aria-required="true"
|
||||
v-model="newResource.title"
|
||||
id="new-resource-link-title"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -200,6 +204,7 @@
|
|||
type="textarea"
|
||||
v-model="newResource.summary"
|
||||
id="new-resource-summary"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
|
|
@ -60,6 +60,7 @@
|
|||
type="email"
|
||||
id="account-email"
|
||||
v-model="newEmail"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<p class="help">{{ t("You'll receive a confirmation email.") }}</p>
|
||||
|
@ -72,6 +73,7 @@
|
|||
password-reveal
|
||||
minlength="6"
|
||||
v-model="passwordForEmailChange"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<o-button class="mt-2" variant="primary" nativeType="submit">
|
||||
|
@ -117,6 +119,7 @@
|
|||
minlength="6"
|
||||
id="account-old-password"
|
||||
v-model="oldPassword"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<o-field :label="t('New password')" label-for="account-new-password">
|
||||
|
@ -128,6 +131,7 @@
|
|||
minlength="6"
|
||||
id="account-new-password"
|
||||
v-model="newPassword"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<o-button class="mt-2" variant="primary" nativeType="submit">
|
||||
|
@ -243,7 +247,7 @@ import {
|
|||
} from "../../graphql/user";
|
||||
import RouteName from "../../router/name";
|
||||
import { logout, SELECTED_PROVIDERS } from "../../utils/auth";
|
||||
import { useProgrammatic } from "@oruga-ui/oruga-next";
|
||||
import { useOruga } from "@oruga-ui/oruga-next";
|
||||
|
||||
const { t } = useI18n({ useScope: "global" });
|
||||
|
||||
|
@ -341,12 +345,12 @@ const {
|
|||
DELETE_ACCOUNT
|
||||
);
|
||||
|
||||
const { oruga } = useProgrammatic();
|
||||
const { notification } = useOruga();
|
||||
|
||||
deleteAccountMutationDone(async () => {
|
||||
console.debug("Deleted account, logging out client...");
|
||||
await logout(false);
|
||||
oruga.notification.open({
|
||||
notification.open({
|
||||
message: t("Your account has been successfully deleted"),
|
||||
variant: "success",
|
||||
position: "bottom-right",
|
||||
|
|
|
@ -240,10 +240,9 @@
|
|||
<o-tooltip
|
||||
:label="$t('URL copied to clipboard')"
|
||||
:active="showCopiedTooltip.atom"
|
||||
always
|
||||
variant="success"
|
||||
position="left"
|
||||
>
|
||||
/>
|
||||
<o-button
|
||||
tag="a"
|
||||
icon-left="rss"
|
||||
|
@ -259,14 +258,13 @@
|
|||
target="_blank"
|
||||
>{{ $t("RSS/Atom Feed") }}</o-button
|
||||
>
|
||||
</o-tooltip>
|
||||
|
||||
<o-tooltip
|
||||
:label="$t('URL copied to clipboard')"
|
||||
:active="showCopiedTooltip.ics"
|
||||
always
|
||||
variant="success"
|
||||
position="left"
|
||||
>
|
||||
/>
|
||||
<o-button
|
||||
tag="a"
|
||||
@click="
|
||||
|
@ -282,7 +280,6 @@
|
|||
target="_blank"
|
||||
>{{ $t("ICS/WebCal Feed") }}</o-button
|
||||
>
|
||||
</o-tooltip>
|
||||
<o-button
|
||||
icon-left="refresh"
|
||||
variant="text"
|
||||
|
|
|
@ -52,6 +52,7 @@
|
|||
<o-input
|
||||
aria-required="true"
|
||||
required
|
||||
expanded
|
||||
id="email"
|
||||
type="email"
|
||||
v-model="credentials.email"
|
||||
|
@ -63,6 +64,7 @@
|
|||
aria-required="true"
|
||||
id="password"
|
||||
required
|
||||
expanded
|
||||
type="password"
|
||||
password-reveal
|
||||
v-model="credentials.password"
|
||||
|
|
|
@ -19,6 +19,7 @@
|
|||
password-reveal
|
||||
minlength="6"
|
||||
v-model="credentials.password"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<o-field :label="$t('Password (confirmation)')">
|
||||
|
@ -29,6 +30,7 @@
|
|||
password-reveal
|
||||
minlength="6"
|
||||
v-model="credentials.passwordConfirmation"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<button class="button is-primary">
|
||||
|
|
|
@ -103,6 +103,7 @@
|
|||
v-model="credentials.email"
|
||||
@blur="showGravatar = true"
|
||||
@focus="showGravatar = false"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
@ -120,6 +121,7 @@
|
|||
password-reveal
|
||||
minlength="6"
|
||||
v-model="credentials.password"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
|
||||
|
|
|
@ -14,6 +14,7 @@
|
|||
type="email"
|
||||
id="emailAddress"
|
||||
v-model="emailValue"
|
||||
expanded
|
||||
/>
|
||||
</o-field>
|
||||
<p class="flex flex-wrap gap-1 mt-2">
|
||||
|
|
|
@ -18,7 +18,7 @@ exports[`CommentTree > renders a comment tree with comments 1`] = `
|
|||
</div>
|
||||
</div>
|
||||
<div data-v-5d0380ab=\\"\\" class=\\"\\">
|
||||
<o-button-stub data-v-5d0380ab=\\"\\" variant=\\"primary\\" iconleft=\\"send\\" rounded=\\"false\\" outlined=\\"false\\" loading=\\"false\\" expanded=\\"false\\" inverted=\\"false\\" nativetype=\\"submit\\" tag=\\"button\\" disabled=\\"false\\" iconboth=\\"false\\"></o-button-stub>
|
||||
<o-button-stub data-v-5d0380ab=\\"\\" variant=\\"primary\\" iconleft=\\"send\\" rounded=\\"false\\" outlined=\\"false\\" loading=\\"false\\" expanded=\\"false\\" inverted=\\"false\\" nativetype=\\"submit\\" tag=\\"button\\" disabled=\\"false\\"></o-button-stub>
|
||||
</div>
|
||||
</article>
|
||||
</form>
|
||||
|
@ -56,7 +56,7 @@ exports[`CommentTree > renders an empty comment tree 1`] = `
|
|||
</div>
|
||||
</div>
|
||||
<div data-v-5d0380ab=\\"\\" class=\\"\\">
|
||||
<o-button-stub data-v-5d0380ab=\\"\\" variant=\\"primary\\" iconleft=\\"send\\" rounded=\\"false\\" outlined=\\"false\\" loading=\\"false\\" expanded=\\"false\\" inverted=\\"false\\" nativetype=\\"submit\\" tag=\\"button\\" disabled=\\"false\\" iconboth=\\"false\\"></o-button-stub>
|
||||
<o-button-stub data-v-5d0380ab=\\"\\" variant=\\"primary\\" iconleft=\\"send\\" rounded=\\"false\\" outlined=\\"false\\" loading=\\"false\\" expanded=\\"false\\" inverted=\\"false\\" nativetype=\\"submit\\" tag=\\"button\\" disabled=\\"false\\"></o-button-stub>
|
||||
</div>
|
||||
</article>
|
||||
</form>
|
||||
|
|
Loading…
Reference in a new issue