shishantbiswas/bknd
1
0
Fork 0
mirror of https://github.com/shishantbiswas/bknd.git synced 2026-03-17 04:46:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

replaced all react-query usages with new hooks + removed react-query

Browse Source
This commit is contained in:
dswbx
2024-12-13 17:36:09 +01:00
parent 8c91dff94d
commit 1631bbb754
23 changed files with 148 additions and 644 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
app/src/ui/container/EntitiesContainer.tsx
View File

@@ -1,95 +0,0 @@
import type { UseQueryOptions, UseQueryResult } from "@tanstack/react-query";
import type { RepositoryResponse } from "data";
import type { RepoQuery } from "data";
import { useClient } from "../client";
import { type EntityData, type QueryStatus, getStatus } from "./EntityContainer";
export type RenderParams<Data extends EntityData = EntityData> = {
data: Data[] | undefined;
meta: RepositoryResponse["meta"] | undefined;
status: {
fetch: QueryStatus;
};
raw: {
fetch: UseQueryResult;
};
actions: {
create(obj: any): any;
update(id: number, obj: any): any;
};
};
export type EntitiesContainerProps = {
entity: string;
query?: Partial<RepoQuery>;
queryOptions?: Partial<UseQueryOptions>;
};
export function useEntities(
entity: string,
query?: Partial<RepoQuery>,
queryOptions?: Partial<UseQueryOptions>
): RenderParams {
const client = useClient();
let data: any = null;
let meta: any = null;
const fetchQuery = client.query(queryOptions).data.entity(entity).readMany(query);
const createMutation = client.mutation.data.entity(entity).create();
const updateMutation = (id: number) => client.mutation.data.entity(entity).update(id);
if (fetchQuery?.isSuccess) {
meta = fetchQuery.data?.body.meta;
data = fetchQuery.data?.body.data;
}
function create(obj: any) {
// biome-ignore lint/suspicious/noAsyncPromiseExecutor: <explanation>
return new Promise(async (resolve, reject) => {
await createMutation?.mutate(obj, {
onSuccess: resolve,
onError: reject
});
});
}
function update(id: number, obj: any) {
// biome-ignore lint/suspicious/noAsyncPromiseExecutor: <explanation>
return new Promise(async (resolve, reject) => {
await updateMutation(id).mutate(obj, {
onSuccess: resolve,
onError: reject
});
});
}
return {
data,
meta,
actions: {
create,
update
// remove
},
status: {
fetch: getStatus(fetchQuery)
},
raw: {
fetch: fetchQuery
}
};
}
export function EntitiesContainer<Data extends EntityData = EntityData>({
entity,
query,
queryOptions,
children
}: EntitiesContainerProps & {
children(params: RenderParams<Data>): any;
}) {
const params = useEntities(entity, query, queryOptions);
return children(params as any);
}
export const Entities = EntitiesContainer;

136
app/src/ui/container/EntityContainer.tsx
View File

@@ -1,136 +0,0 @@
import type { UseQueryResult } from "@tanstack/react-query";
import type { RepoQuery } from "data";
import { useClient } from "../client";
export type EntityData = Record<string, any>;
export type EntityContainerRenderParams<Data extends EntityData = EntityData> = {
data: Data | null;
client: ReturnType<typeof useClient>;
initialValues: object;
raw: {
fetch?: UseQueryResult;
};
status: {
fetch: QueryStatus;
};
actions: {
create(obj: any): any;
update(obj: any): any;
remove(): any;
};
};
export type MutationStatus = {
isLoading: boolean;
isSuccess: boolean;
isError: boolean;
};
export type QueryStatus = MutationStatus & {
isUpdating: boolean;
};
export function getStatus(query?: UseQueryResult): QueryStatus {
return {
isLoading: query ? query.isPending : false,
isUpdating: query ? !query.isInitialLoading && query.isFetching : false,
isSuccess: query ? query.isSuccess : false,
isError: query ? query.isError : false
};
}
export type EntityContainerProps = {
entity: string;
id?: number;
};
type FetchOptions = {
disabled?: boolean;
query?: Partial<Omit<RepoQuery, "where" | "limit" | "offset">>;
};
// @todo: add option to disable fetches (for form updates)
// @todo: must return a way to indicate error!
export function useEntity<Data extends EntityData = EntityData>(
entity: string,
id?: number,
options?: { fetch?: FetchOptions }
): EntityContainerRenderParams<Data> {
const client = useClient();
let data: any = null;
const fetchQuery = id
? client.query().data.entity(entity).readOne(id, options?.fetch?.query)
: undefined;
const createMutation = id ? null : client.mutation.data.entity(entity).create();
const updateMutation = id ? client.mutation.data.entity(entity).update(id) : undefined;
const deleteMutation = id ? client.mutation.data.entity(entity).delete(id) : undefined;
if (fetchQuery?.isSuccess) {
data = fetchQuery.data?.body.data;
}
const initialValues = { one: 1 };
function create(obj: any) {
// biome-ignore lint/suspicious/noAsyncPromiseExecutor: <explanation>
return new Promise(async (resolve, reject) => {
await createMutation?.mutate(obj, {
onSuccess: resolve,
onError: reject
});
});
}
function update(obj: any) {
// biome-ignore lint/suspicious/noAsyncPromiseExecutor: <explanation>
return new Promise(async (resolve, reject) => {
//await new Promise((r) => setTimeout(r, 4000));
await updateMutation?.mutate(obj, {
onSuccess: resolve,
onError: reject
});
});
}
function remove() {
// biome-ignore lint/suspicious/noAsyncPromiseExecutor: <explanation>
return new Promise(async (resolve, reject) => {
//await new Promise((r) => setTimeout(r, 4000));
await deleteMutation?.mutate(undefined, {
onSuccess: resolve,
onError: reject
});
});
}
return {
data,
client,
initialValues,
actions: {
create,
update,
remove
},
status: {
fetch: getStatus(fetchQuery)
//update: getMutationStatus(updateMutation),
},
raw: {
fetch: fetchQuery
}
};
}
export function EntityContainer({
entity,
id,
children
}: EntityContainerProps & { children(params: EntityContainerRenderParams): any }) {
const params = useEntity(entity, id);
return children(params);
}
export const Entity = EntityContainer;

2
app/src/ui/container/index.ts
View File

@@ -1,2 +0,0 @@
export * from "./EntitiesContainer";
export * from "./EntityContainer";