refactor: expose pluginType for plugins

dhis2 · Dec 16, 2024 · abd64a4 · abd64a4
1 parent f1b94f9
commit abd64a4
Show file tree

Hide file tree

Showing 7 changed files with 43 additions and 18 deletions.
diff --git a/client/src/components/PluginTag/PluginTag.js b/client/src/components/PluginTag/PluginTag.js
@@ -0,0 +1,12 @@
+import { Tag } from '@dhis2/ui'
+
+const PluginTag = ({ hasPlugin, pluginType }) => {
+    if (!hasPlugin) {
+        return null
+    }
+    const tagString = pluginType ? `Plugin: ${pluginType}` : 'Plugin'
+
+    return <Tag neutral>{tagString}</Tag>
+}
+
+export default PluginTag
diff --git a/client/src/pages/AppView/AppView.js b/client/src/pages/AppView/AppView.js
@@ -17,13 +17,15 @@ import AppIcon from 'src/components/AppIcon/AppIcon'
 import Screenshots from 'src/components/Screenshots/Screenshots'
 import Versions from 'src/components/Versions/Versions'
 import { renderDhisVersionsCompatibility } from 'src/lib/render-dhis-versions-compatibility'
+import PluginTag from '../../components/PluginTag/PluginTag'
 
 const HeaderSection = ({
     appName,
     appDeveloper,
     appType,
     logoSrc,
     hasPlugin,
+    pluginType,
 }) => (
     <section
         className={classnames(styles.appCardSection, styles.appCardHeader)}
@@ -34,7 +36,9 @@ const HeaderSection = ({
             <span className={styles.appCardDeveloper}>by {appDeveloper}</span>
             <div className={styles.appCardTypeContainer}>
                 <span className={styles.appCardType}>{appType}</span>
-                {hasPlugin && <Tag neutral>Plugin</Tag>}
+                {hasPlugin && (
+                    <PluginTag hasPlugin={hasPlugin} pluginType={pluginType} />
+                )}
             </div>
         </div>
     </section>
@@ -44,6 +48,7 @@ HeaderSection.propTypes = {
     appDeveloper: PropTypes.string.isRequired,
     appName: PropTypes.string.isRequired,
     appType: PropTypes.string.isRequired,
+    pluginType: PropTypes.string,
     hasPlugin: PropTypes.bool,
     logoSrc: PropTypes.string,
 }
@@ -129,6 +134,7 @@ const AppView = ({ match }) => {
                 appType={config.ui.appTypeToDisplayName[app.appType]}
                 logoSrc={logoSrc}
                 hasPlugin={app.hasPlugin}
+                pluginType={app.pluginType}
             />
             <Divider />
             <AboutSection

diff --git a/client/src/pages/Apps/AppCards/AppCardItem/AppCardItem.js b/client/src/pages/Apps/AppCards/AppCardItem/AppCardItem.js
@@ -1,20 +1,21 @@
-import { Tag } from '@dhis2/ui'
 import PropTypes from 'prop-types'
 import React from 'react'
 import ReactMarkdown from 'react-markdown'
 import { Link } from 'react-router-dom'
 import styles from './AppCardItem.module.css'
 import config from 'config'
 import AppIcon from 'src/components/AppIcon/AppIcon'
+import PluginTag from '../../../../components/PluginTag/PluginTag'
 
 const AppCardItem = ({
     id,
     name,
     developer,
-    type,
+    appType,
     description,
     images,
     hasPlugin,
+    pluginType,
 }) => {
     const logo = images.find((elem) => elem.logo)
 
@@ -30,10 +31,15 @@ const AppCardItem = ({
                     </span>
                     <div className={styles.appTypeContainer}>
                         <span className={styles.appCardType}>
-                            {config.ui.appTypeToDisplayName[type]}
+                            {config.ui.appTypeToDisplayName[appType]}
                         </span>
 
-                        {hasPlugin && <Tag neutral>Plugin</Tag>}
+                        {hasPlugin && (
+                            <PluginTag
+                                hasPlugin={hasPlugin}
+                                pluginType={pluginType}
+                            />
+                        )}
                     </div>
                 </div>
             </header>
@@ -66,9 +72,10 @@ AppCardItem.propTypes = {
         organisation: PropTypes.string,
     }).isRequired,
     id: PropTypes.string.isRequired,
-    hasPlugin: PropTypes.bool.isRequired,
     name: PropTypes.string.isRequired,
-    type: PropTypes.string.isRequired,
+    hasPlugin: PropTypes.bool.isRequired,
+    pluginType: PropTypes.string.isRequired,
+    appType: PropTypes.string.isRequired,
     description: PropTypes.string,
     images: PropTypes.array,
 }

diff --git a/client/src/pages/Apps/AppCards/AppCards.js b/client/src/pages/Apps/AppCards/AppCards.js
@@ -31,16 +31,7 @@ const AppCards = ({ isLoading, error, apps }) => {
     return (
         <div className={styles.appCards}>
             {apps.map((app) => (
-                <AppCardItem
-                    key={app.id}
-                    id={app.id}
-                    name={app.name}
-                    developer={app.developer}
-                    type={app.appType}
-                    description={app.description}
-                    images={app.images}
-                    hasPlugin={app.hasPlugin}
-                />
+                <AppCardItem key={app.id} {...app} />
             ))}
         </div>
     )

diff --git a/client/src/pages/UserApp/DetailsCard/DetailsCard.js b/client/src/pages/UserApp/DetailsCard/DetailsCard.js
@@ -9,6 +9,7 @@ import * as api from 'src/api'
 import AppDescription from 'src/components/AppDescription/AppDescription'
 import AppIcon from 'src/components/AppIcon/AppIcon'
 import { useSuccessAlert, useErrorAlert } from 'src/lib/use-alert'
+import PluginTag from '../../../components/PluginTag/PluginTag'
 
 const { appTypeToDisplayName } = config.ui
 
@@ -91,7 +92,12 @@ const DetailsCard = ({ app, mutate }) => {
                         by {appDeveloper}
                     </span>
                     <span className={styles.detailsCardType}>{appType}</span>
-                    {app.hasPlugin && <Tag neutral>Plugin</Tag>}
+                    {app.hasPlugin && (
+                        <PluginTag
+                            hasPlugin={app.hasPlugin}
+                            pluginType={app.pluginType}
+                        />
+                    )}
                 </div>
             </section>
             <Divider />

diff --git a/server/src/models/v1/out/App.js b/server/src/models/v1/out/App.js
@@ -39,6 +39,8 @@ const def = Joi.object().keys({
 
     hasPlugin: Joi.boolean().allow(null, false),
 
+    pluginType: Joi.string().allow(null),
+
     // only indicating if there is a changelog or not here
     // to avoid addding a masssive changelog to the payload
     hasChangelog: Joi.boolean().allow(null, false),

diff --git a/server/src/routes/v1/apps/formatting/convertAppsToApiV1Format.js b/server/src/routes/v1/apps/formatting/convertAppsToApiV1Format.js
@@ -18,6 +18,7 @@ const convertDbAppViewRowToAppApiV1Object = (app) => ({
 
     hasChangelog: app.has_changelog,
     hasPlugin: app.has_plugin,
+    pluginType: app.plugin_type,
     coreApp: app.core_app,
     versions: [],