refactor shopify storefront
This commit is contained in:
65
services/media-adapter.ts
Normal file
65
services/media-adapter.ts
Normal file
@@ -0,0 +1,65 @@
|
||||
import type {
|
||||
MediaAdapter,
|
||||
MediaItem,
|
||||
MediaPage,
|
||||
} from "@reacteditor/plugin-media";
|
||||
|
||||
const MEDIA_BASE = "https://www.frontend-ai.com";
|
||||
const MEDIA_API_KEY = (import.meta.env.VITE_API_KEY as string | undefined) ?? "";
|
||||
|
||||
export const frontendAiMediaAdapter: MediaAdapter = {
|
||||
fetchList: async ({ query, cursor, signal }) => {
|
||||
const url = new URL("/api/media", MEDIA_BASE);
|
||||
if (query) url.searchParams.set("query", query);
|
||||
if (cursor) url.searchParams.set("cursor", cursor);
|
||||
const res = await fetch(url, {
|
||||
method: "GET",
|
||||
headers: { "X-Api-Key": MEDIA_API_KEY },
|
||||
signal,
|
||||
});
|
||||
if (!res.ok) throw new Error(`List failed: ${res.status}`);
|
||||
return (await res.json()) as MediaPage;
|
||||
},
|
||||
|
||||
upload: (file, opts) =>
|
||||
new Promise<MediaItem>((resolve, reject) => {
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open("POST", `${MEDIA_BASE}/api/media`);
|
||||
xhr.setRequestHeader("X-Api-Key", MEDIA_API_KEY);
|
||||
xhr.upload.onprogress = (e) => {
|
||||
if (e.lengthComputable) opts?.onProgress?.(e.loaded / e.total);
|
||||
};
|
||||
xhr.onload = () => {
|
||||
if (xhr.status >= 400) {
|
||||
reject(new Error(xhr.responseText || `Upload failed: ${xhr.status}`));
|
||||
return;
|
||||
}
|
||||
try {
|
||||
resolve(JSON.parse(xhr.responseText) as MediaItem);
|
||||
} catch (err) {
|
||||
reject(err instanceof Error ? err : new Error(String(err)));
|
||||
}
|
||||
};
|
||||
xhr.onerror = () => reject(new Error("Network error"));
|
||||
xhr.onabort = () => {
|
||||
const err = new Error("Aborted");
|
||||
err.name = "AbortError";
|
||||
reject(err);
|
||||
};
|
||||
opts?.signal?.addEventListener("abort", () => xhr.abort());
|
||||
const fd = new FormData();
|
||||
fd.append("file", file);
|
||||
xhr.send(fd);
|
||||
}),
|
||||
|
||||
delete: async (id) => {
|
||||
const res = await fetch(
|
||||
`${MEDIA_BASE}/api/media/${encodeURIComponent(id)}`,
|
||||
{
|
||||
method: "DELETE",
|
||||
headers: { "X-Api-Key": MEDIA_API_KEY },
|
||||
},
|
||||
);
|
||||
if (!res.ok) throw new Error(`Delete failed: ${res.status}`);
|
||||
},
|
||||
};
|
||||
Reference in New Issue
Block a user