build: switch from yarn to npm to manage js dependencies and move js contents to root

yarn v1 is being deprecated and starts to have some issues

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

src/composition/activity.ts

@@ -0,0 +1,32 @@
+import { IActivity } from "@/types/activity.model";
+import { IMember } from "@/types/actor/member.model";
+import { useCurrentActorClient } from "./apollo/actor";
+
+export function useIsActivityAuthorCurrentActor() {
+  const { currentActor } = useCurrentActorClient();
+
+  return (activity: IActivity): boolean => {
+    return (
+      activity.author.id === currentActor.value?.id &&
+      currentActor.value?.id !== undefined
+    );
+  };
+}
+
+export function useIsActivityObjectCurrentActor() {
+  const { currentActor } = useCurrentActorClient();
+  return (activity: IActivity): boolean =>
+    (activity?.object as IMember)?.actor?.id === currentActor.value?.id &&
+    currentActor.value?.id !== undefined;
+}
+
+export function useActivitySubjectParams() {
+  return (activity: IActivity) =>
+    activity.subjectParams.reduce(
+      (acc: Record<string, string>, { key, value }) => {
+        acc[key] = value;
+        return acc;
+      },
+      {}
+    );
+}

src/composition/apollo/actor.ts

@@ -0,0 +1,69 @@
+import {
+  CURRENT_ACTOR_CLIENT,
+  GROUP_MEMBERSHIP_SUBSCRIPTION_CHANGED,
+  IDENTITIES,
+  PERSON_STATUS_GROUP,
+} from "@/graphql/actor";
+import { IPerson } from "@/types/actor";
+import { ICurrentUser } from "@/types/current-user.model";
+import { useQuery } from "@vue/apollo-composable";
+import { computed, Ref, unref } from "vue";
+import { useCurrentUserClient } from "./user";
+
+export function useCurrentActorClient() {
+  const {
+    result: currentActorResult,
+    error,
+    loading,
+  } = useQuery<{ currentActor: IPerson }>(CURRENT_ACTOR_CLIENT);
+  const currentActor = computed<IPerson | undefined>(
+    () => currentActorResult.value?.currentActor
+  );
+  return { currentActor, error, loading };
+}
+
+export function useCurrentUserIdentities() {
+  const { currentUser } = useCurrentUserClient();
+
+  const { result, error, loading } = useQuery<{
+    loggedUser: Pick<ICurrentUser, "actors">;
+  }>(IDENTITIES, {}, () => ({
+    enabled:
+      currentUser.value?.id !== undefined &&
+      currentUser.value?.id !== null &&
+      currentUser.value?.isLoggedIn === true,
+  }));
+
+  const identities = computed(() => result.value?.loggedUser?.actors);
+  return { identities, error, loading };
+}
+
+export function usePersonStatusGroup(
+  groupFederatedUsername: string | undefined | Ref<string | undefined>
+) {
+  const { currentActor } = useCurrentActorClient();
+  const { result, error, loading, subscribeToMore } = useQuery<{
+    person: IPerson;
+  }>(
+    PERSON_STATUS_GROUP,
+    () => ({
+      id: currentActor.value?.id,
+      group: unref(groupFederatedUsername),
+    }),
+    () => ({
+      enabled:
+        currentActor.value?.id !== undefined &&
+        unref(groupFederatedUsername) !== undefined &&
+        unref(groupFederatedUsername) !== "",
+    })
+  );
+  subscribeToMore(() => ({
+    document: GROUP_MEMBERSHIP_SUBSCRIPTION_CHANGED,
+    variables: {
+      actorId: currentActor.value?.id,
+      group: unref(groupFederatedUsername),
+    },
+  }));
+  const person = computed(() => result.value?.person);
+  return { person, error, loading };
+}

src/composition/apollo/address.ts

@@ -0,0 +1,16 @@
+import { REVERSE_GEOCODE } from "@/graphql/address";
+import { useLazyQuery } from "@vue/apollo-composable";
+import { IAddress } from "@/types/address.model";
+
+type reverseGeoCodeType = {
+  latitude: number;
+  longitude: number;
+  zoom: number;
+  locale: string;
+};
+
+export function useReverseGeocode() {
+  return useLazyQuery<{ reverseGeocode: IAddress[] }, reverseGeoCodeType>(
+    REVERSE_GEOCODE
+  );
+}

src/composition/apollo/config.ts

@@ -0,0 +1,234 @@
+import {
+  ABOUT,
+  ANALYTICS,
+  ANONYMOUS_ACTOR_ID,
+  ANONYMOUS_PARTICIPATION_CONFIG,
+  ANONYMOUS_REPORTS_CONFIG,
+  DEMO_MODE,
+  EVENT_CATEGORIES,
+  EVENT_PARTICIPANTS,
+  FEATURES,
+  GEOCODING_AUTOCOMPLETE,
+  LOCATION,
+  MAPS_TILES,
+  REGISTRATIONS,
+  RESOURCE_PROVIDERS,
+  RESTRICTIONS,
+  ROUTING_TYPE,
+  SEARCH_CONFIG,
+  TIMEZONES,
+  UPLOAD_LIMITS,
+} from "@/graphql/config";
+import { IConfig } from "@/types/config.model";
+import { useQuery } from "@vue/apollo-composable";
+import { computed } from "vue";
+
+export function useTimezones() {
+  const {
+    result: timezoneResult,
+    error,
+    loading,
+  } = useQuery<{
+    config: Pick<IConfig, "timezones">;
+  }>(TIMEZONES, undefined, { fetchPolicy: "cache-first" });
+
+  const timezones = computed(() => timezoneResult.value?.config?.timezones);
+  return { timezones, error, loading };
+}
+
+export function useAnonymousParticipationConfig() {
+  const {
+    result: configResult,
+    error,
+    loading,
+  } = useQuery<{
+    config: Pick<IConfig, "anonymous">;
+  }>(ANONYMOUS_PARTICIPATION_CONFIG);
+
+  const anonymousParticipationConfig = computed(
+    () => configResult.value?.config?.anonymous?.participation
+  );
+
+  return { anonymousParticipationConfig, error, loading };
+}
+
+export function useAnonymousReportsConfig() {
+  const {
+    result: configResult,
+    error,
+    loading,
+  } = useQuery<{
+    config: Pick<IConfig, "anonymous">;
+  }>(ANONYMOUS_REPORTS_CONFIG);
+
+  const anonymousReportsConfig = computed(
+    () => configResult.value?.config?.anonymous?.reports
+  );
+  return { anonymousReportsConfig, error, loading };
+}
+
+export function useInstanceName() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "name">;
+  }>(ABOUT);
+
+  const instanceName = computed(() => result.value?.config?.name);
+  return { instanceName, error, loading };
+}
+
+export function useAnonymousActorId() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "anonymous">;
+  }>(ANONYMOUS_ACTOR_ID);
+
+  const anonymousActorId = computed(
+    () => result.value?.config?.anonymous?.actorId
+  );
+  return { anonymousActorId, error, loading };
+}
+
+export function useUploadLimits() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "uploadLimits">;
+  }>(UPLOAD_LIMITS);
+
+  const uploadLimits = computed(() => result.value?.config?.uploadLimits);
+  return { uploadLimits, error, loading };
+}
+
+export function useEventCategories() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "eventCategories">;
+  }>(EVENT_CATEGORIES);
+
+  const eventCategories = computed(() => result.value?.config.eventCategories);
+  return { eventCategories, error, loading };
+}
+
+export function useRestrictions() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "restrictions">;
+  }>(RESTRICTIONS);
+
+  const restrictions = computed(() => result.value?.config.restrictions);
+  return { restrictions, error, loading };
+}
+
+export function useExportFormats() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "exportFormats">;
+  }>(EVENT_PARTICIPANTS);
+  const exportFormats = computed(() => result.value?.config?.exportFormats);
+  return { exportFormats, error, loading };
+}
+
+export function useGeocodingAutocomplete() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "geocoding">;
+  }>(GEOCODING_AUTOCOMPLETE);
+  const geocodingAutocomplete = computed(
+    () => result.value?.config?.geocoding?.autocomplete
+  );
+  return { geocodingAutocomplete, error, loading };
+}
+
+export function useMapTiles() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "maps">;
+  }>(MAPS_TILES);
+
+  const tiles = computed(() => result.value?.config.maps.tiles);
+  return { tiles, error, loading };
+}
+
+export function useRoutingType() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "maps">;
+  }>(ROUTING_TYPE);
+
+  const routingType = computed(() => result.value?.config.maps.routing.type);
+  return { routingType, error, loading };
+}
+
+export function useFeatures() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "features">;
+  }>(FEATURES);
+
+  const features = computed(() => result.value?.config.features);
+  return { features, error, loading };
+}
+
+export function useResourceProviders() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "resourceProviders">;
+  }>(RESOURCE_PROVIDERS);
+
+  const resourceProviders = computed(
+    () => result.value?.config.resourceProviders
+  );
+  return { resourceProviders, error, loading };
+}
+
+export function useServerProvidedLocation() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "location">;
+  }>(LOCATION);
+
+  const location = computed(() => result.value?.config.location);
+  return { location, error, loading };
+}
+
+export function useIsDemoMode() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "demoMode">;
+  }>(DEMO_MODE);
+
+  const isDemoMode = computed(() => result.value?.config.demoMode);
+  return { isDemoMode, error, loading };
+}
+
+export function useAnalytics() {
+  const { result, error, loading } = useQuery<{
+    config: Pick<IConfig, "analytics">;
+  }>(ANALYTICS);
+
+  const analytics = computed(() => result.value?.config.analytics);
+  return { analytics, error, loading };
+}
+
+export function useSearchConfig() {
+  const { result, error, loading, onResult } = useQuery<{
+    config: Pick<IConfig, "search">;
+  }>(SEARCH_CONFIG);
+
+  const searchConfig = computed(() => result.value?.config.search);
+  return { searchConfig, error, loading, onResult };
+}
+
+export function useRegistrationConfig() {
+  const { result, error, loading, onResult } = useQuery<{
+    config: Pick<
+      IConfig,
+      "registrationsOpen" | "registrationsAllowlist" | "auth"
+    >;
+  }>(REGISTRATIONS);
+
+  const registrationsOpen = computed(
+    () => result.value?.config?.registrationsOpen
+  );
+  const registrationsAllowlist = computed(
+    () => result.value?.config?.registrationsAllowlist
+  );
+  const databaseLogin = computed(
+    () => result.value?.config?.auth?.databaseLogin
+  );
+  return {
+    registrationsOpen,
+    registrationsAllowlist,
+    databaseLogin,
+    error,
+    loading,
+    onResult,
+  };
+}

src/composition/apollo/discussions.ts

@@ -0,0 +1,44 @@
+import { useQuery } from "@vue/apollo-composable";
+import { computed, unref } from "vue";
+import { useCurrentUserClient } from "./user";
+import type { Ref } from "vue";
+import { IGroup } from "@/types/actor";
+import { GROUP_DISCUSSIONS_LIST } from "@/graphql/discussion";
+
+export function useGroupDiscussionsList(
+  name: string | undefined | Ref<string | undefined>,
+  options?: {
+    discussionsPage?: number;
+    discussionsLimit?: number;
+  }
+) {
+  const { currentUser } = useCurrentUserClient();
+  const { result, error, loading, onResult, onError, refetch } = useQuery<
+    {
+      group: Pick<
+        IGroup,
+        "id" | "preferredUsername" | "name" | "domain" | "discussions"
+      >;
+    },
+    {
+      name: string;
+      discussionsPage?: number;
+      discussionsLimit?: number;
+    }
+  >(
+    GROUP_DISCUSSIONS_LIST,
+    () => ({
+      name: unref(name),
+      ...options,
+    }),
+    () => ({
+      enabled:
+        unref(name) !== undefined &&
+        unref(name) !== "" &&
+        currentUser.value?.isLoggedIn,
+      fetchPolicy: "cache-and-network",
+    })
+  );
+  const group = computed(() => result.value?.group);
+  return { group, error, loading, onResult, onError, refetch };
+}

src/composition/apollo/event.ts

@@ -0,0 +1,54 @@
+import { DELETE_EVENT, FETCH_EVENT, FETCH_EVENT_BASIC } from "@/graphql/event";
+import { IEvent } from "@/types/event.model";
+import { useMutation, useQuery } from "@vue/apollo-composable";
+import { Ref, computed, unref } from "vue";
+
+export function useFetchEvent(uuidValue?: string | Ref<string>) {
+  const uuid = unref(uuidValue);
+  const {
+    result: fetchEventResult,
+    loading,
+    error,
+    onError,
+    onResult,
+    refetch,
+  } = useQuery<{ event: IEvent }>(
+    FETCH_EVENT,
+    () => ({
+      uuid,
+    }),
+    () => ({
+      enabled: uuid !== undefined,
+    })
+  );
+
+  const event = computed(() => fetchEventResult.value?.event);
+
+  return { event, loading, error, onError, onResult, refetch };
+}
+
+export function useFetchEventBasic(uuidValue?: string | Ref<string>) {
+  const uuid = unref(uuidValue);
+  const {
+    result: fetchEventResult,
+    loading,
+    error,
+    onResult,
+    onError,
+  } = useQuery<{ event: IEvent }>(FETCH_EVENT_BASIC, {
+    uuid,
+  });
+
+  const event = computed(() => fetchEventResult.value?.event);
+
+  return { event, loading, error, onResult, onError };
+}
+
+export function useDeleteEvent() {
+  return useMutation<{ id: string }, { eventId: string }>(DELETE_EVENT, () => ({
+    update(cache, { data }) {
+      cache.evict({ id: `Event:${data?.id}` });
+      cache.gc();
+    },
+  }));
+}

src/composition/apollo/group.ts

@@ -0,0 +1,126 @@
+import { PERSON_MEMBERSHIPS } from "@/graphql/actor";
+import {
+  CREATE_GROUP,
+  DELETE_GROUP,
+  FETCH_GROUP_PUBLIC,
+  LEAVE_GROUP,
+  UPDATE_GROUP,
+} from "@/graphql/group";
+import { IGroup, IPerson } from "@/types/actor";
+import { IAddress } from "@/types/address.model";
+import { GroupVisibility, MemberRole, Openness } from "@/types/enums";
+import { IMediaUploadWrapper } from "@/types/media.model";
+import { ApolloCache, FetchResult, InMemoryCache } from "@apollo/client/core";
+import { useMutation, useQuery } from "@vue/apollo-composable";
+import { computed, Ref, unref } from "vue";
+import { useCurrentActorClient } from "./actor";
+
+type useGroupOptions = {
+  beforeDateTime?: string | Date;
+  afterDateTime?: string | Date;
+  organisedEventsPage?: number;
+  organisedEventsLimit?: number;
+  postsPage?: number;
+  postsLimit?: number;
+  membersPage?: number;
+  membersLimit?: number;
+  discussionsPage?: number;
+  discussionsLimit?: number;
+};
+
+export function useGroup(
+  name: string | undefined | Ref<string | undefined>,
+  options: useGroupOptions = {}
+) {
+  const { result, error, loading, onResult, onError, refetch } = useQuery<
+    {
+      group: IGroup;
+    },
+    {
+      name: string;
+      beforeDateTime?: string | Date;
+      afterDateTime?: string | Date;
+      organisedEventsPage?: number;
+      organisedEventsLimit?: number;
+      postsPage?: number;
+      postsLimit?: number;
+      membersPage?: number;
+      membersLimit?: number;
+      discussionsPage?: number;
+      discussionsLimit?: number;
+    }
+  >(
+    FETCH_GROUP_PUBLIC,
+    () => ({
+      name: unref(name),
+      ...options,
+    }),
+    () => ({
+      enabled: unref(name) !== undefined && unref(name) !== "",
+      fetchPolicy: "cache-and-network",
+    })
+  );
+  const group = computed(() => result.value?.group);
+  return { group, error, loading, onResult, onError, refetch };
+}
+
+export function useCreateGroup() {
+  const { currentActor } = useCurrentActorClient();
+
+  return useMutation<
+    { createGroup: IGroup },
+    {
+      preferredUsername: string;
+      name: string;
+      summary?: string;
+      avatar?: IMediaUploadWrapper;
+      banner?: IMediaUploadWrapper;
+    }
+  >(CREATE_GROUP, () => ({
+    update: (store: ApolloCache<InMemoryCache>, { data }: FetchResult) => {
+      const query = {
+        query: PERSON_MEMBERSHIPS,
+        variables: {
+          id: currentActor.value?.id,
+        },
+      };
+      const membershipData = store.readQuery<{ person: IPerson }>(query);
+      if (!membershipData) return;
+      if (!currentActor.value) return;
+      const { person } = membershipData;
+      person.memberships?.elements.push({
+        parent: data?.createGroup,
+        role: MemberRole.ADMINISTRATOR,
+        actor: currentActor.value,
+        insertedAt: new Date().toString(),
+        updatedAt: new Date().toString(),
+      });
+      store.writeQuery({ ...query, data: { person } });
+    },
+  }));
+}
+
+export function useUpdateGroup() {
+  return useMutation<
+    { updateGroup: IGroup },
+    {
+      id: string;
+      name?: string;
+      summary?: string;
+      openness?: Openness;
+      visibility?: GroupVisibility;
+      physicalAddress?: IAddress;
+      manuallyApprovesFollowers?: boolean;
+    }
+  >(UPDATE_GROUP);
+}
+
+export function useDeleteGroup(variables: { groupId: string }) {
+  return useMutation<{ deleteGroup: IGroup }>(DELETE_GROUP, () => ({
+    variables,
+  }));
+}
+
+export function useLeaveGroup() {
+  return useMutation<{ leaveGroup: { id: string } }>(LEAVE_GROUP);
+}

src/composition/apollo/members.ts

@@ -0,0 +1,46 @@
+import { GROUP_MEMBERS } from "@/graphql/member";
+import { IGroup } from "@/types/actor";
+import { MemberRole } from "@/types/enums";
+import { useQuery } from "@vue/apollo-composable";
+import { computed } from "vue";
+import type { Ref } from "vue";
+
+type useGroupMembersOptions = {
+  membersPage?: number;
+  membersLimit?: number;
+  roles?: MemberRole[];
+  enabled?: Ref<boolean>;
+  name?: string;
+};
+
+export function useGroupMembers(
+  groupName: Ref<string>,
+  options: useGroupMembersOptions = {}
+) {
+  console.debug("useGroupMembers", options);
+  const { result, error, loading, onResult, onError, refetch, fetchMore } =
+    useQuery<
+      {
+        group: IGroup;
+      },
+      {
+        name: string;
+        membersPage?: number;
+        membersLimit?: number;
+      }
+    >(
+      GROUP_MEMBERS,
+      () => ({
+        groupName: groupName.value,
+        page: options.membersPage,
+        limit: options.membersLimit,
+        name: options.name,
+      }),
+      () => ({
+        enabled: !!groupName.value && options.enabled?.value,
+        fetchPolicy: "cache-and-network",
+      })
+    );
+  const members = computed(() => result.value?.group?.members);
+  return { members, error, loading, onResult, onError, refetch, fetchMore };
+}

src/composition/apollo/report.ts

@@ -0,0 +1,15 @@
+import { CREATE_REPORT } from "@/graphql/report";
+import { useMutation } from "@vue/apollo-composable";
+
+export function useCreateReport() {
+  return useMutation<
+    { createReport: { id: string } },
+    {
+      eventsIds?: string[];
+      reportedId: string;
+      content?: string;
+      commentsIds?: string[];
+      forward?: boolean;
+    }
+  >(CREATE_REPORT);
+}

src/composition/apollo/resources.ts

@@ -0,0 +1,44 @@
+import { useQuery } from "@vue/apollo-composable";
+import { computed, unref } from "vue";
+import { useCurrentUserClient } from "./user";
+import type { Ref } from "vue";
+import { IGroup } from "@/types/actor";
+import { GROUP_RESOURCES_LIST } from "@/graphql/resources";
+
+export function useGroupResourcesList(
+  name: string | undefined | Ref<string | undefined>,
+  options?: {
+    resourcesPage?: number;
+    resourcesLimit?: number;
+  }
+) {
+  const { currentUser } = useCurrentUserClient();
+  const { result, error, loading, onResult, onError, refetch } = useQuery<
+    {
+      group: Pick<
+        IGroup,
+        "id" | "preferredUsername" | "name" | "domain" | "resources"
+      >;
+    },
+    {
+      name: string;
+      resourcesPage?: number;
+      resourcesLimit?: number;
+    }
+  >(
+    GROUP_RESOURCES_LIST,
+    () => ({
+      name: unref(name),
+      ...options,
+    }),
+    () => ({
+      enabled:
+        unref(name) !== undefined &&
+        unref(name) !== "" &&
+        currentUser.value?.isLoggedIn,
+      fetchPolicy: "cache-and-network",
+    })
+  );
+  const group = computed(() => result.value?.group);
+  return { group, error, loading, onResult, onError, refetch };
+}

src/composition/apollo/tags.ts

@@ -0,0 +1,24 @@
+import { FILTER_TAGS } from "@/graphql/tags";
+import { ITag } from "@/types/tag.model";
+import { apolloClient } from "@/vue-apollo";
+import { provideApolloClient, useLazyQuery } from "@vue/apollo-composable";
+
+export async function fetchTags(text: string): Promise<ITag[]> {
+  try {
+    const { load: loadFetchTagsQuery } = useLazyQuery<
+      { tags: ITag[] },
+      { filter: string }
+    >(FILTER_TAGS);
+
+    const res = await provideApolloClient(apolloClient)(() =>
+      loadFetchTagsQuery(FILTER_TAGS, {
+        filter: text,
+      })
+    );
+    if (!res) return [];
+    return res.tags;
+  } catch (e) {
+    console.error(e);
+    return [];
+  }
+}

src/composition/apollo/user.ts

@@ -0,0 +1,105 @@
+import { IDENTITIES, REGISTER_PERSON } from "@/graphql/actor";
+import {
+  CURRENT_USER_CLIENT,
+  LOGGED_USER,
+  SET_USER_SETTINGS,
+  UPDATE_USER_LOCALE,
+  USER_SETTINGS,
+} from "@/graphql/user";
+import { IPerson } from "@/types/actor";
+import { ICurrentUser, IUser } from "@/types/current-user.model";
+import { ActorType } from "@/types/enums";
+import { ApolloCache, FetchResult } from "@apollo/client/core";
+import { useMutation, useQuery } from "@vue/apollo-composable";
+import { computed } from "vue";
+
+export function useCurrentUserClient() {
+  const {
+    result: currentUserResult,
+    error,
+    loading,
+    onResult,
+  } = useQuery<{
+    currentUser: ICurrentUser;
+  }>(CURRENT_USER_CLIENT);
+
+  const currentUser = computed(() => currentUserResult.value?.currentUser);
+  return { currentUser, error, loading, onResult };
+}
+
+export function useLoggedUser() {
+  const { currentUser } = useCurrentUserClient();
+
+  const { result, error, onError } = useQuery<{ loggedUser: IUser }>(
+    LOGGED_USER,
+    {},
+    () => ({ enabled: currentUser.value?.id != null })
+  );
+
+  const loggedUser = computed(() => result.value?.loggedUser);
+  return { loggedUser, error, onError };
+}
+
+export function useUserSettings() {
+  const {
+    result: userSettingsResult,
+    error,
+    loading,
+  } = useQuery<{ loggedUser: IUser }>(USER_SETTINGS);
+
+  const loggedUser = computed(() => userSettingsResult.value?.loggedUser);
+  return { loggedUser, error, loading };
+}
+
+export async function doUpdateSetting(
+  variables: Record<string, unknown>
+): Promise<void> {
+  useMutation<{ setUserSettings: string }>(SET_USER_SETTINGS, () => ({
+    variables,
+  }));
+}
+
+export function updateLocale() {
+  return useMutation<{ id: string; locale: string }>(UPDATE_USER_LOCALE);
+}
+
+export function registerAccount() {
+  return useMutation<
+    { registerPerson: IPerson },
+    {
+      preferredUsername: string;
+      name: string;
+      summary: string;
+      email: string;
+    }
+  >(REGISTER_PERSON, () => ({
+    update: (
+      store: ApolloCache<{ registerPerson: IPerson }>,
+      { data: localData }: FetchResult,
+      { context }
+    ) => {
+      if (context?.userAlreadyActivated) {
+        const currentUserData = store.readQuery<{
+          loggedUser: Pick<ICurrentUser, "actors" | "id">;
+        }>({
+          query: IDENTITIES,
+        });
+
+        if (currentUserData && localData) {
+          const newPersonData = {
+            ...localData.registerPerson,
+            type: ActorType.PERSON,
+          };
+
+          store.writeQuery({
+            query: IDENTITIES,
+            data: {
+              ...currentUserData.loggedUser,
+              actors: [[...currentUserData.loggedUser.actors, newPersonData]],
+            },
+          });
+        }
+      }
+    },
+  }));
+}

src/composition/config.ts

@@ -0,0 +1,22 @@
+import { useExportFormats, useUploadLimits } from "./apollo/config";
+
+export const useHost = (): string => {
+  return window.location.hostname;
+};
+
+export const useAvatarMaxSize = (): number | undefined => {
+  const { uploadLimits } = useUploadLimits();
+
+  return uploadLimits.value?.avatar;
+};
+
+export const useBannerMaxSize = (): number | undefined => {
+  const { uploadLimits } = useUploadLimits();
+
+  return uploadLimits.value?.banner;
+};
+
+export const useParticipantsExportFormats = () => {
+  const { exportFormats } = useExportFormats();
+  return exportFormats.value?.eventParticipants;
+};