Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-08-05 13:35:23 +02:00
Code Issues Releases Activity

feat: User Tooltip (#4319)

Browse source
This commit is contained in:
Michael Genson 2024-10-11 19:36:26 -05:00 • committed by GitHub
parent a2bdb02a7f
commit e06572b7ca
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
23 changed files with 164 additions and 80 deletions
Download patch file Download diff file Expand all files Collapse all files

23
frontend/composables/api/api-client.ts
View file

@ -57,35 +57,30 @@ function getRequests(axiosInstance: NuxtAxiosInstance): ApiRequestInstance {
};
}
export const useAdminApi = function (): AdminAPI {
export const useRequests = function (): ApiRequestInstance {
const { $axios, i18n } = useContext();
$axios.setHeader("Accept-Language", i18n.locale);
const requests = getRequests($axios);
return getRequests($axios);
};
export const useAdminApi = function (): AdminAPI {
const requests = useRequests();
return new AdminAPI(requests);
};
export const useUserApi = function (): UserApi {
const { $axios, i18n } = useContext();
$axios.setHeader("Accept-Language", i18n.locale);
const requests = getRequests($axios);
const requests = useRequests();
return new UserApi(requests);
};
export const usePublicApi = function (): PublicApi {
const { $axios, i18n } = useContext();
$axios.setHeader("Accept-Language", i18n.locale);
const requests = getRequests($axios);
const requests = useRequests();
return new PublicApi(requests);
};
export const usePublicExploreApi = function (groupSlug: string): PublicExploreApi {
const { $axios, i18n } = useContext();
$axios.setHeader("Accept-Language", i18n.locale);
const requests = getRequests($axios);
const requests = useRequests();
return new PublicExploreApi(requests, groupSlug);
}

10
frontend/composables/partials/use-actions-factory.ts
View file

@ -6,7 +6,7 @@ import { QueryValue } from "~/lib/api/base/route";
interface ReadOnlyStoreActions<T extends BoundT> {
getAll(page?: number, perPage?: number, params?: any): Ref<T[] | null>;
refresh(): Promise<void>;
refresh(page?: number, perPage?: number, params?: any): Promise<void>;
}
interface StoreActions<T extends BoundT> extends ReadOnlyStoreActions<T> {
@ -50,9 +50,9 @@ export function useReadOnlyActions<T extends BoundT>(
return allItems;
}
async function refresh() {
async function refresh(page = 1, perPage = -1, params = {} as Record<string, QueryValue>) {
loading.value = true;
const { data } = await api.getAll();
const { data } = await api.getAll(page, perPage, params);
if (data && data.items && allRef) {
allRef.value = data.items;
@ -101,9 +101,9 @@ export function useStoreActions<T extends BoundT>(
return allItems;
}
async function refresh() {
async function refresh(page = 1, perPage = -1, params = {} as Record<string, QueryValue>) {
loading.value = true;
const { data } = await api.getAll();
const { data } = await api.getAll(page, perPage, params);
if (data && data.items && allRef) {
allRef.value = data.items;

19
frontend/composables/partials/use-store-factory.ts
View file

@ -2,6 +2,7 @@ import { ref, reactive, Ref } from "@nuxtjs/composition-api";
import { useReadOnlyActions, useStoreActions } from "./use-actions-factory";
import { BoundT } from "./types";
import { BaseCRUDAPI, BaseCRUDAPIReadOnly } from "~/lib/api/base/base-clients";
import { QueryValue } from "~/lib/api/base/route";
export const useData = function<T extends BoundT>(defaultObject: T) {
const data = reactive({ ...defaultObject });
@ -16,16 +17,21 @@ export const useReadOnlyStore = function<T extends BoundT>(
store: Ref<T[]>,
loading: Ref<boolean>,
api: BaseCRUDAPIReadOnly<T>,
params = {} as Record<string, QueryValue>,
) {
const storeActions = useReadOnlyActions(api, store, loading);
const actions = {
...useReadOnlyActions(api, store, loading),
...storeActions,
async refresh() {
return await storeActions.refresh(1, -1, params);
},
flushStore() {
store.value = [];
},
};
if (!loading.value && (!store.value || store.value.length === 0)) {
const result = actions.getAll();
const result = actions.getAll(1, -1, params);
store.value = result.value || [];
}
@ -36,16 +42,21 @@ export const useStore = function<T extends BoundT>(
store: Ref<T[]>,
loading: Ref<boolean>,
api: BaseCRUDAPI<unknown, T, unknown>,
params = {} as Record<string, QueryValue>,
) {
const storeActions = useStoreActions(api, store, loading);
const actions = {
...useStoreActions(api, store, loading),
...storeActions,
async refresh() {
return await storeActions.refresh(1, -1, params);
},
flushStore() {
store = ref([]);
},
};
if (!loading.value && (!store.value || store.value.length === 0)) {
const result = actions.getAll();
const result = actions.getAll(1, -1, params);
store.value = result.value || [];
}

20
frontend/composables/store/use-user-store.ts Normal file
View file

@ -0,0 +1,20 @@
import { ref, Ref } from "@nuxtjs/composition-api";
import { useReadOnlyStore } from "../partials/use-store-factory";
import { useRequests } from "../api/api-client";
import { UserSummary } from "~/lib/api/types/user";
import { BaseCRUDAPIReadOnly } from "~/lib/api/base/base-clients";
const store: Ref<UserSummary[]> = ref([]);
const loading = ref(false);
class GroupUserAPIReadOnly extends BaseCRUDAPIReadOnly<UserSummary> {
baseRoute = "/api/groups/members";
itemRoute = (idOrUsername: string | number) => `/groups/members/${idOrUsername}`;
}
export const useUserStore = function () {
const requests = useRequests();
const api = new GroupUserAPIReadOnly(requests);
return useReadOnlyStore<UserSummary>(store, loading, api, {orderBy: "full_name"});
}