yujunjun/strapi
1
0
Fork 0
mirror of https://github.com/strapi/strapi.git synced 2025-09-26 08:52:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #12614 from strapi/copy-command-and-track

Browse Source 
[MARKET] add copy command and track usage data
This commit is contained in:
Rémi de Juvigny 2022-02-23 12:24:43 +01:00 committed by GitHub
commit 1a1c7fe9a4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
packages/core/admin/admin/src/pages/MarketplacePage/components/PluginCard/index.js
View File

@ -12,7 +12,8 @@ import { Icon } from '@strapi/design-system/Icon';
import ExternalLink from '@strapi/icons/ExternalLink'; import ExternalLink from '@strapi/icons/ExternalLink';
import Duplicate from '@strapi/icons/Duplicate'; import Duplicate from '@strapi/icons/Duplicate';
import Check from '@strapi/icons/Check'; import Check from '@strapi/icons/Check';
import { useNotification, useTracking } from '@strapi/helper-plugin';
import { CopyToClipboard } from 'react-copy-to-clipboard';
// Custom component to have an ellipsis after the 2nd line // Custom component to have an ellipsis after the 2nd line
const EllipsisText = styled(Typography)` const EllipsisText = styled(Typography)`
/* stylelint-disable value-no-vendor-prefix, property-no-vendor-prefix */ /* stylelint-disable value-no-vendor-prefix, property-no-vendor-prefix */
@ -26,11 +27,14 @@ const EllipsisText = styled(Typography)`
const PluginCard = ({ plugin, installedPlugins, useYarn }) => { const PluginCard = ({ plugin, installedPlugins, useYarn }) => {
const { attributes } = plugin; const { attributes } = plugin;
const { formatMessage } = useIntl(); const { formatMessage } = useIntl();
const toggleNotification = useNotification();
const { trackUsage } = useTracking();
const isInstalled = installedPlugins.includes(attributes.npmPackageName); const isInstalled = installedPlugins.includes(attributes.npmPackageName);
// TODO: remove and use const commandToCopy = useYarn
console.log(useYarn); ? `yarn add ${attributes.npmPackageName}`
: `npm install ${attributes.npmPackageName}`;
return ( return (
<Flex <Flex
@ -80,6 +84,7 @@ const PluginCard = ({ plugin, installedPlugins, useYarn }) => {
{ pluginName: attributes.name } { pluginName: attributes.name }
)} )}
variant="tertiary" variant="tertiary"
onClick={() => trackUsage('didLearnMore')}
> >
{formatMessage({ {formatMessage({
id: 'admin.pages.MarketPlacePage.plugin.info.text', id: 'admin.pages.MarketPlacePage.plugin.info.text',
@ -97,12 +102,23 @@ const PluginCard = ({ plugin, installedPlugins, useYarn }) => {
</Typography> </Typography>
</Box> </Box>
) : ( ) : (
<Button size="S" endIcon={<Duplicate />} variant="secondary"> <CopyToClipboard
{formatMessage({ onCopy={() => {
id: 'admin.pages.MarketPlacePage.plugin.copy', trackUsage('willInstallPlugin');
defaultMessage: 'Copy install command', toggleNotification({
})} type: 'success',
</Button> message: { id: 'admin.pages.MarketPlacePage.plugin.copy.success' },
});
}}
text={commandToCopy}
>
<Button size="S" endIcon={<Duplicate />} variant="secondary">
{formatMessage({
id: 'admin.pages.MarketPlacePage.plugin.copy',
defaultMessage: 'Copy install command',
})}
</Button>
</CopyToClipboard>
)} )}
</Stack> </Stack>
</Flex> </Flex>

1
packages/core/admin/admin/src/translations/en.json
View File

@ -64,6 +64,7 @@
"admin.pages.MarketPlacePage.plugin.info.text": "Learn more", "admin.pages.MarketPlacePage.plugin.info.text": "Learn more",
"admin.pages.MarketPlacePage.plugin.info.label": "Learn more about {pluginName}", "admin.pages.MarketPlacePage.plugin.info.label": "Learn more about {pluginName}",
"admin.pages.MarketPlacePage.plugin.copy": "Copy install command", "admin.pages.MarketPlacePage.plugin.copy": "Copy install command",
"admin.pages.MarketPlacePage.plugin.copy.success": "install command copied",
"admin.pages.MarketPlacePage.plugin.installed": "Installed", "admin.pages.MarketPlacePage.plugin.installed": "Installed",
"admin.pages.MarketPlacePage.plugin.info": "Learn more", "admin.pages.MarketPlacePage.plugin.info": "Learn more",
"admin.pages.MarketPlacePage.submit.plugin.link": "Submit your plugin", "admin.pages.MarketPlacePage.submit.plugin.link": "Submit your plugin",