point providers to npm

This commit is contained in:
Mark Kaylor 2022-06-07 09:45:54 +02:00
parent d9f20fa209
commit 29558b960f
3 changed files with 26 additions and 4 deletions

View File

@ -25,7 +25,13 @@ const EllipsisText = styled(Typography)`
overflow: hidden;
`;
const NpmPackageCard = ({ npmPackage, installedPackageNames, useYarn, isInDevelopmentMode }) => {
const NpmPackageCard = ({
npmPackage,
installedPackageNames,
useYarn,
isInDevelopmentMode,
npmPackageType,
}) => {
const { attributes } = npmPackage;
const { formatMessage } = useIntl();
const { trackUsage } = useTracking();
@ -41,6 +47,11 @@ const NpmPackageCard = ({ npmPackage, installedPackageNames, useYarn, isInDevelo
defaultMessage: 'Made by Strapi',
});
const npmPackageHref =
npmPackageType === 'provider'
? attributes.npmPackageUrl
: `https://market.strapi.io/plugins/${attributes.slug}`;
return (
<Flex
direction="column"
@ -107,7 +118,7 @@ const NpmPackageCard = ({ npmPackage, installedPackageNames, useYarn, isInDevelo
<Stack horizontal spacing={2} style={{ alignSelf: 'flex-end' }} paddingTop={6}>
<LinkButton
size="S"
href={`https://market.strapi.io/plugins/${attributes.slug}`}
href={npmPackageHref}
isExternal
endIcon={<ExternalLink />}
aria-label={formatMessage(
@ -159,6 +170,7 @@ NpmPackageCard.propTypes = {
installedPackageNames: PropTypes.arrayOf(PropTypes.string).isRequired,
useYarn: PropTypes.bool.isRequired,
isInDevelopmentMode: PropTypes.bool,
npmPackageType: PropTypes.string.isRequired,
};
export default NpmPackageCard;

View File

@ -3,7 +3,13 @@ import PropTypes from 'prop-types';
import { Grid, GridItem } from '@strapi/design-system/Grid';
import NpmPackageCard from '../NpmPackageCard';
const NpmPackagesGrid = ({ npmPackages, installedPackageNames, useYarn, isInDevelopmentMode }) => {
const NpmPackagesGrid = ({
npmPackages,
installedPackageNames,
useYarn,
isInDevelopmentMode,
npmPackageType,
}) => {
return (
<Grid gap={4}>
{npmPackages.map((npmPackage) => (
@ -13,6 +19,7 @@ const NpmPackagesGrid = ({ npmPackages, installedPackageNames, useYarn, isInDeve
installedPackageNames={installedPackageNames}
useYarn={useYarn}
isInDevelopmentMode={isInDevelopmentMode}
npmPackageType={npmPackageType}
/>
</GridItem>
))}
@ -29,6 +36,7 @@ NpmPackagesGrid.propTypes = {
installedPackageNames: PropTypes.arrayOf(PropTypes.string),
useYarn: PropTypes.bool.isRequired,
isInDevelopmentMode: PropTypes.bool.isRequired,
npmPackageType: PropTypes.string.isRequired,
};
export default NpmPackagesGrid;

View File

@ -231,7 +231,7 @@ const MarketPlacePage = () => {
)}
/>
) : (
<TabGroup label="Some stuff for the label" id="tabs" variant="simple">
<TabGroup label="Plugins and Providers for Strapi" id="tabs" variant="simple">
<Box paddingBottom={4}>
<Tabs>
<Tab>Plugins ({searchResults.length})</Tab>
@ -245,6 +245,7 @@ const MarketPlacePage = () => {
installedPackageNames={installedPluginNames}
useYarn={appInfoResponse.data.useYarn}
isInDevelopmentMode={isInDevelopmentMode}
npmPackageType="plugin"
/>
</TabPanel>
<TabPanel>
@ -252,6 +253,7 @@ const MarketPlacePage = () => {
npmPackages={marketplaceProvidersResponse.data}
useYarn={appInfoResponse.data.useYarn}
isInDevelopmentMode={isInDevelopmentMode}
npmPackageType="provider"
/>
</TabPanel>
</TabPanels>