Duffer Derek

Current Path : /var/www/uibuilder.cmshelp.dk/httpdocs/src/app/_components/services/
Upload File :
Current File : /var/www/uibuilder.cmshelp.dk/httpdocs/src/app/_components/services/mediaService.ts

import umbracoService from "./umbracoService";
import { v4 as uuidv4 } from 'uuid';
const host = "https://uibuilderbackend.s.cmshelp.dk";

class MediaService {
  async fetchMedia(id: string | null = null, dataTypeId: string | null = null) {
    debugger
    const token = await umbracoService.getToken();
    const url = new URL(`${host}/umbraco/management/api/v1/collection/media`);
    url.searchParams.append('orderBy', 'updateDate');
    url.searchParams.append('orderDirection', 'Descending');
    url.searchParams.append('skip', '0');
    url.searchParams.append('take', '100');
    if (id) url.searchParams.append('id', id);
    if (dataTypeId) url.searchParams.append('dataTypeId', dataTypeId);

    const response = await fetch(url.toString(), {
      method: "GET",
      headers: {
        Authorization: `Bearer ${token}`,
      },
    });

    if (!response.ok) {
      throw new Error("Failed to fetch media");
    }

    const mediaData = await response.json();
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
    const mediaIds = mediaData?.items?.filter((item: any) => item.mediaType.alias === 'Image').map((item: any) => item.id);
    const imageUrls = await this.fetchImageUrls(mediaIds);
    debugger
      // eslint-disable-next-line @typescript-eslint/no-explicit-any
    const mediaItems = await Promise.all(mediaData?.items?.map(async (item: any) => {
      if (item.mediaType.alias === 'Folder') {
        const subItems = await this.fetchMedia(item.id);
        return {
          id: item.id,
          name: item.variants[0].name,
          type: item.mediaType.alias,
          subItems,
          urlInfos: []
        };
      } else {
        return {
          id: item.id,
          name: item.variants[0].name,
          type: item.mediaType.alias,
            // eslint-disable-next-line @typescript-eslint/no-explicit-any
          urlInfos: imageUrls.find((urlInfo: any) => urlInfo.id === item.id)?.urlInfos || []
        };
      }
    }));

    return mediaItems;
  }

  async fetchImageUrls(mediaIds: string[]) {
    debugger
    const token = await umbracoService.getToken();
    const url = `${host}/umbraco/management/api/v1/imaging/resize/urls?${mediaIds?.map(id => `id=${id}`).join('&')}&height=200&width=200`;

    const response = await fetch(url, {
      method: "GET",
      headers: {
        Authorization: `Bearer ${token}`,
      },
    });

    if (!response.ok) {
      throw new Error("Failed to fetch image URLs");
    }

    return response.json();
  }

  async createFolder(folderName: string, parentId: string | null): Promise<void>  {
    const token = await umbracoService.getToken();
    const folderId = uuidv4();
    const folderPayload = {
      id: folderId,
      parent: parentId ? { id: parentId } : null,
      mediaType: {
        id: "f38bd2d7-65d0-48e6-95dc-87ce06ec2d3d"
      },
      values: [],
      variants: [
        {
          culture: null,
          segment: null,
          name: folderName
        }
      ]
    };

    const response = await fetch(
      `${host}/umbraco/management/api/v1/media`,
      {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          Authorization: `Bearer ${token}`,
        },
        body: JSON.stringify(folderPayload),
      }
    );

    if (!response.ok) {
      throw new Error("Failed to create folder");
    }
  }

  async uploadMedia(folderId: string | null, file: File, fileName: string): Promise<void> {
    const token = await umbracoService.getToken();
    const temporaryFileId = uuidv4();
    const formData = new FormData();
    formData.append("file", file);
    formData.append("id", temporaryFileId);

    const tempFileResponse = await fetch(
      `${host}/umbraco/management/api/v1/temporary-file`,
      {
        method: "POST",
        headers: {
          Authorization: `Bearer ${token}`,
        },
        body: formData,
      }
    );

    if (!tempFileResponse.ok) {
      throw new Error("Failed to upload temporary file");
    }

    const mediaId = uuidv4();
    const mediaPayload = {
      id: mediaId,
      parent: folderId ? { id: folderId } : null,
      mediaType: {
        id: "cc07b313-0843-4aa8-bbda-871c8da728c8"
      },
      values: [
        {
          editorAlias: "Umbraco.ImageCropper",
          alias: "umbracoFile",
          culture: null,
          segment: null,
          value: {
            temporaryFileId: temporaryFileId,
            src: "",
            crops: [],
            focalPoint: {
              left: 0.5,
              top: 0.5
            }
          }
        }
      ],
      variants: [
        {
          culture: null,
          segment: null,
          name: fileName || file.name
        }
      ]
    };

    const response = await fetch(
      `${host}/umbraco/management/api/v1/media`,
      {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          Authorization: `Bearer ${token}`,
        },
        body: JSON.stringify(mediaPayload),
      }
    );

    if (!response.ok) {
      throw new Error("Failed to create media");
    }
  }

  async deleteMedia(mediaId: string) {
    const token = await umbracoService.getToken();
    const response = await fetch(
      `${host}/umbraco/management/api/v1/media/${mediaId}`,
      {
        method: "DELETE",
        headers: {
          Authorization: `Bearer ${token}`,
        },
      }
    );

    if (!response.ok) {
      throw new Error("Failed to delete media");
    }

    return response.json();
  }
  // ...other media-related methods...
}

export default new MediaService();

Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists