From db9745ef81ec28bfa7b154fbcd28550691c5f74c Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Wed, 27 Oct 2021 16:04:58 +0200
Subject: [PATCH] refactor(v4): plugin icon as react component

---
 admin/src/components/PluginIcon/index.js | 13 +++++++++++++
 admin/src/index.js                       |  6 +++---
 package.json                             |  3 ++-
 yarn.lock                                |  2 +-
 4 files changed, 19 insertions(+), 5 deletions(-)
 create mode 100644 admin/src/components/PluginIcon/index.js

diff --git a/admin/src/components/PluginIcon/index.js b/admin/src/components/PluginIcon/index.js
new file mode 100644
index 0000000..5e24554
--- /dev/null
+++ b/admin/src/components/PluginIcon/index.js
@@ -0,0 +1,13 @@
+/**
+ *
+ * PluginIcon
+ *
+ */
+
+import React from 'react';
+import { Icon } from '@strapi/design-system/Icon';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+
+const PluginIcon = () => <Icon as={() => <FontAwesomeIcon icon="sync" />} width="16px" />;
+
+export default PluginIcon;
diff --git a/admin/src/index.js b/admin/src/index.js
index c01b112..b60becf 100644
--- a/admin/src/index.js
+++ b/admin/src/index.js
@@ -1,17 +1,17 @@
 import { prefixPluginTranslations } from '@strapi/helper-plugin';
 import pluginPkg from '../../package.json';
 import pluginId from './helpers/pluginId';
+import pluginIcon from './components/PluginIcon';
 // import pluginPermissions from './permissions';
 // import getTrad from './helpers/getTrad';
 
 const pluginDescription = pluginPkg.strapi.description || pluginPkg.description;
-const { icon, name } = pluginPkg.strapi;
+const { name } = pluginPkg.strapi;
 
 export default {
   register(app) {
     app.registerPlugin({
       description: pluginDescription,
-      icon,
       id: pluginId,
       isReady: true,
       isRequired: pluginPkg.strapi.required || false,
@@ -20,7 +20,7 @@ export default {
 
     app.addMenuLink({
       to: `/plugins/${pluginId}`,
-      icon,
+      icon: pluginIcon,
       intlLabel: {
         id: `${pluginId}.plugin.name`,
         defaultMessage: 'Config Sync',
diff --git a/package.json b/package.json
index 5c3365f..c2d4526 100644
--- a/package.json
+++ b/package.json
@@ -39,9 +39,10 @@
     "strapi-server.js"
   ],
   "devDependencies": {
+    "@fortawesome/react-fontawesome": "^0.1.16",
+    "@strapi/design-system": "0.0.1-alpha.51",
     "@strapi/helper-plugin": "4.0.0-beta.6",
     "@strapi/icons": "0.0.1-alpha.51",
-    "@strapi/design-system": "0.0.1-alpha.51",
     "@strapi/utils": "4.0.0-beta.6",
     "babel-eslint": "9.0.0",
     "codecov": "^3.8.3",
diff --git a/yarn.lock b/yarn.lock
index d6edbf0..abc17c7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -625,7 +625,7 @@
   dependencies:
     "@fortawesome/fontawesome-common-types" "^0.2.36"
 
-"@fortawesome/react-fontawesome@^0.1.14", "@fortawesome/react-fontawesome@^0.1.4":
+"@fortawesome/react-fontawesome@^0.1.14", "@fortawesome/react-fontawesome@^0.1.16", "@fortawesome/react-fontawesome@^0.1.4":
   version "0.1.16"
   resolved "https://registry.yarnpkg.com/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.16.tgz#ce7665490214e20f929368d6b65f68884a99276a"
   integrity sha512-aLmzDwC9rEOAJv2UJdMns89VZR5Ry4IHu5dQQh24Z/lWKEm44lfQr1UNalZlkUaQN8d155tNh+CS7ntntj1VMA==