From 5964441d9e3605bc9b4d8826639a3d1416c71de9 Mon Sep 17 00:00:00 2001
From: gordielachance <gordielachance@users.noreply.github.com>
Date: Mon, 14 Oct 2024 15:02:17 +0200
Subject: [PATCH] pluginId --> PLUGIN_ID

---
 admin/src/components/Initializer.tsx   |  4 +-
 admin/src/components/MediaLib.tsx      | 61 ++++++++++----------------
 admin/src/components/ReactMdEditor.tsx |  4 +-
 admin/src/index.ts                     |  4 +-
 admin/src/pluginId.ts                  |  5 ---
 admin/src/utils/getTranslation.ts      |  4 +-
 admin/src/utils/pluginId.ts            |  3 ++
 7 files changed, 34 insertions(+), 51 deletions(-)
 delete mode 100644 admin/src/pluginId.ts
 create mode 100644 admin/src/utils/pluginId.ts

diff --git a/admin/src/components/Initializer.tsx b/admin/src/components/Initializer.tsx
index 72c7127..2789fcb 100644
--- a/admin/src/components/Initializer.tsx
+++ b/admin/src/components/Initializer.tsx
@@ -5,7 +5,7 @@
  */
 
 import { useEffect, useRef } from 'react';
-import pluginId from '../pluginId';
+import {PLUGIN_ID} from '../utils/pluginId';
 
 type InitializerProps = {
   setPlugin: (id: string) => void;
@@ -15,7 +15,7 @@ const Initializer = ({ setPlugin }: InitializerProps) => {
   const ref = useRef(setPlugin);
 
   useEffect(() => {
-    ref.current(pluginId);
+    ref.current(PLUGIN_ID);
   }, []);
 
   return null;
diff --git a/admin/src/components/MediaLib.tsx b/admin/src/components/MediaLib.tsx
index 5892747..9619e7c 100644
--- a/admin/src/components/MediaLib.tsx
+++ b/admin/src/components/MediaLib.tsx
@@ -1,7 +1,6 @@
-import { FC as FunctionComponent } from "react";
-
-import { useStrapiApp } from "@strapi/admin/strapi-admin";
-import type { Schema } from "@strapi/types";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useStrapiApp } from '@strapi/strapi/admin';
 
 const prefixFileUrlWithBackendUrl = (fileURL: string) => {
   return !!fileURL &&
@@ -14,47 +13,33 @@ const prefixFileUrlWithBackendUrl = (fileURL: string) => {
     : fileURL;
 };
 
-interface MediaLibComponentProps {
-  isOpen: boolean;
-  onChange: (files: Schema.Attribute.MediaValue<true>) => void;
-  onToggle: () => void;
-}
-
-const MediaLib: FunctionComponent<MediaLibComponentProps> = ({
-  isOpen,
-  onChange,
-  onToggle,
-}) => {
-  const components = useStrapiApp("ImageDialog", (state) => state.components);
-  if (!components || !isOpen) return null;
-
-  const MediaLibraryDialog = components["media-library"] as FunctionComponent<{
-    onClose: () => void;
-    onSelectAssets: (_images: Schema.Attribute.MediaValue<true>) => void;
-  }>;
-
-  const handleSelectAssets = (files: Schema.Attribute.MediaValue<true>) => {
-    const formattedFiles = files.map((f) => ({
+const MediaLib = ( { isOpen = false, onChange = () => {}, onToggle = () => {} } ) => {
+  const { components } = useStrapiApp( 'library', app => app );
+  const MediaLibraryDialog = components[ 'media-library' ];
+
+  const handleSelectAssets = files => {
+    const formattedFiles = files.map(f => ( {
       alt: f.alternativeText || f.name,
-      url: prefixFileUrlWithBackendUrl(f.url),
+      url: prefixFileUrlWithBackendUrl( f.url ),
       mime: f.mime,
-    }));
+    } ) );
+
+    onChange( formattedFiles );
+  };
 
-    onChange(formattedFiles);
+  if ( !isOpen ) {
+    return null
   };
 
-  return (
-    <MediaLibraryDialog
-      onClose={onToggle}
-      onSelectAssets={handleSelectAssets}
-    />
+  return(
+    <MediaLibraryDialog onClose={ onToggle } onSelectAssets={ handleSelectAssets } />
   );
 };
 
-MediaLib.defaultProps = {
-  isOpen: false,
-  onChange: (_files: Schema.Attribute.MediaValue<true>) => {},
-  onToggle: () => {},
+MediaLib.propTypes = {
+  isOpen: PropTypes.bool,
+  onChange: PropTypes.func,
+  onToggle: PropTypes.func,
 };
 
-export { MediaLib };
+export default MediaLib;
diff --git a/admin/src/components/ReactMdEditor.tsx b/admin/src/components/ReactMdEditor.tsx
index 4399433..1b41838 100644
--- a/admin/src/components/ReactMdEditor.tsx
+++ b/admin/src/components/ReactMdEditor.tsx
@@ -8,7 +8,7 @@ import { styled } from "styled-components";
 
 import "@uiw/react-markdown-preview/markdown.css";
 
-import pluginId from "../pluginId";
+import {PLUGIN_ID} from '../utils/pluginId';
 import { MediaLib } from "./MediaLib";
 import { useField } from "@strapi/strapi/admin";
 
@@ -179,7 +179,7 @@ const Editor: FunctionComponent<EditorProps> = ({
   }, [JSON.stringify(configs)]);
 
   useEffect(() => {
-    fetch(`/${pluginId}`)
+    fetch(`/${PLUGIN_ID}`)
       .then((response) => response.json())
       .then((data) => {
         setConfigs(data);
diff --git a/admin/src/index.ts b/admin/src/index.ts
index df9ef16..54f1713 100644
--- a/admin/src/index.ts
+++ b/admin/src/index.ts
@@ -1,5 +1,5 @@
 import pluginPkg from "../../package.json";
-import pluginId from "./pluginId";
+import {PLUGIN_ID} from './utils/pluginId';
 import { Initializer } from "./components/Initializer";
 import { Editor as ReactMdEditor } from "./components/ReactMdEditor";
 import { getTranslation } from "./utils/getTranslation";
@@ -10,7 +10,7 @@ export default {
   register(app: any) {
     app.addFields({ type: "richtext", Component: ReactMdEditor });
     const plugin = {
-      id: pluginId,
+      id: PLUGIN_ID,
       initializer: Initializer,
       isReady: false,
       name,
diff --git a/admin/src/pluginId.ts b/admin/src/pluginId.ts
deleted file mode 100644
index 695317c..0000000
--- a/admin/src/pluginId.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import pluginPkg from '../../package.json';
-
-const pluginId = pluginPkg.name.replace(/^(@[^-,.][\w,-]+\/|strapi-)plugin-/i, '');
-
-export default pluginId;
diff --git a/admin/src/utils/getTranslation.ts b/admin/src/utils/getTranslation.ts
index 114bcb0..e323373 100644
--- a/admin/src/utils/getTranslation.ts
+++ b/admin/src/utils/getTranslation.ts
@@ -1,5 +1,5 @@
-import pluginId from '../pluginId';
+import {PLUGIN_ID} from '../utils/pluginId';
 
-const getTranslation = (id: string) => `${pluginId}.${id}`;
+const getTranslation = (id: string) => `${PLUGIN_ID}.${id}`;
 
 export { getTranslation };
diff --git a/admin/src/utils/pluginId.ts b/admin/src/utils/pluginId.ts
new file mode 100644
index 0000000..9ff744b
--- /dev/null
+++ b/admin/src/utils/pluginId.ts
@@ -0,0 +1,3 @@
+import pluginPkg from '../../../package.json';
+
+export const PLUGIN_ID = pluginPkg.strapi.name || pluginPkg.name.replace(/^(@[^-,.][\w,-]+\/|strapi-)plugin-/i, '');