diff --git a/src/components/PlanCard.tsx b/src/components/PlanCard.tsx index 6fd5ed4..12f1707 100644 --- a/src/components/PlanCard.tsx +++ b/src/components/PlanCard.tsx @@ -2,13 +2,14 @@ import { CheckCircle, Timer, ProfileCircle } from "iconoir-react" import "./PlanCard.css" import PlanIcon from "./PlanIcon" import { marked } from "marked" -import { RequirementToU, Features } from "../constants" +import { RequirementToU, Features, PlanIcons } from "../constants" import Requirement from "./Requirement" -type PlanFeature = { +export type PlanFeature = { title: string status: string iconColor: string + icon?: (typeof PlanIcons)[number] ref?: (typeof Features)[number] } diff --git a/src/components/PlanFeatureCard.tsx b/src/components/PlanFeatureCard.tsx new file mode 100644 index 0000000..f47c3f0 --- /dev/null +++ b/src/components/PlanFeatureCard.tsx @@ -0,0 +1,46 @@ +import { CheckCircleSolid, EyeSolid, UserBadgeCheck } from "iconoir-react" +import { OverlayTrigger, Tooltip } from "react-bootstrap" +import { + PlanIconColors, + PlanIconLabels, + PlanIconPublicDomainAccessNoDownload, + PlanIconRestrictedAccessDownload, + PlanIconRestrictedAccessNoDownload, +} from "../constants" +import type { PlanFeature } from "./PlanCard" +const IconsByIconName: { [key: string]: React.ComponentType } = { + [PlanIconRestrictedAccessNoDownload]: UserBadgeCheck, + [PlanIconRestrictedAccessDownload]: UserBadgeCheck, + [PlanIconPublicDomainAccessNoDownload]: EyeSolid, +} + +const PlanFeatureCard: React.FC<{ feature: PlanFeature }> = ({ feature }) => { + const Component = feature.icon + ? IconsByIconName[feature.icon] + : CheckCircleSolid + const color = feature.icon ? PlanIconColors[feature.icon] : "purple" + + if (feature.icon) { + return ( +
+ + + + } + > + + +
+ ) + } + + return +} + +export default PlanFeatureCard diff --git a/src/components/PlansModal.tsx b/src/components/PlansModal.tsx index 943b324..1d36acb 100644 --- a/src/components/PlansModal.tsx +++ b/src/components/PlansModal.tsx @@ -18,8 +18,10 @@ import { Minus, WarningCircle, Xmark, + UserBadgeCheck, } from "iconoir-react" import "./PlansModal.css" +import PlanFeature from "./PlanFeatureCard" const BootstrapColumnLayoutForLabels = { lg: 2, @@ -170,27 +172,7 @@ const PlansModal: React.FC = ({ plans = [] }) => { className="d-flex justify-content-center align-items-center " key={plan.id} > - {feature ? ( - - - - } - > - - - ) : ( - - )} + {feature ? : } ) })} diff --git a/src/constants.ts b/src/constants.ts index 41cba43..ef78c63 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -63,18 +63,18 @@ export const DataFeatureSemanticEnrichmentsPublicDomain = "semantic-enrichments-public-domain" export const DataFeatures: string[] = [ - DataFeatureMetadata, DataFeatureMetadataPublicDomain, - DataFeatureFacsimiles, + DataFeatureMetadata, DataFeatureFacsimilesPublicDomain, - DataFeatureAudio, + DataFeatureFacsimiles, DataFeatureAudioPublicDomain, - DataFeatureTranscripts, + DataFeatureAudio, DataFeatureTranscriptsPublicDomain, - DataFeatureImages, + DataFeatureTranscripts, DataFeatureImagesPublicDomain, - DataFeatureSemanticEnrichments, + DataFeatureImages, DataFeatureSemanticEnrichmentsPublicDomain, + DataFeatureSemanticEnrichments, ] export const DataFeatureLabels: Record = { @@ -118,6 +118,32 @@ export const PlanLabels: Record = { [PlanAcademicUserPlus]: "Academic User Plus", } +export const PlanIconRestrictedAccessNoDownload = + "restricted-only-access-no-download" +export const PlanIconRestrictedAccessDownload = + "restricted-only-access-download" +export const PlanIconPublicDomainAccessNoDownload = + "public-domain-only-access-no-download" +export const PlanIcons: string[] = [ + PlanIconRestrictedAccessNoDownload, + PlanIconRestrictedAccessDownload, + PlanIconPublicDomainAccessNoDownload, +] +export const PlanIconLabels: Record = { + [PlanIconRestrictedAccessNoDownload]: + "Access to protected data determined only by Impresso partners. No download possible", + [PlanIconRestrictedAccessDownload]: + "Access and download to protected data determined only by Impresso partners.", + [PlanIconPublicDomainAccessNoDownload]: + "Access Granted, Download Not Available", +} + +export const PlanIconColors: Record = { + [PlanIconRestrictedAccessNoDownload]: "orange", + [PlanIconRestrictedAccessDownload]: "purple", + [PlanIconPublicDomainAccessNoDownload]: "purple", +} + export const BrowserViewLogin = "login" export const BrowserViewRegister = "signup" export const BrowserViewConfirmRegistration = "confirm-registration" diff --git a/src/content/config.ts b/src/content/config.ts index 854c5a5..f74d50a 100644 --- a/src/content/config.ts +++ b/src/content/config.ts @@ -4,6 +4,7 @@ import { Features, SeriesCategories, SeriesPositions, + PlanIcons, } from "../constants" const notebooks = defineCollection({ @@ -40,7 +41,8 @@ const plans = defineCollection({ title: z.string().optional(), status: z.string().optional(), iconColor: z.string().optional(), - }) + icon: z.enum(PlanIcons as any).optional(), + }), ) .optional(), requirements: z.array(z.enum(Requirements as any)), diff --git a/src/content/plans/02-impresso-user.mdx b/src/content/plans/02-impresso-user.mdx index 796bb40..2102633 100644 --- a/src/content/plans/02-impresso-user.mdx +++ b/src/content/plans/02-impresso-user.mdx @@ -6,17 +6,31 @@ features: - ref: explore-all-features - ref: create-store-export-collections - ref: generate-api-keys + + - ref: metadata-public-domain - ref: metadata + + - ref: facsimiles-public-domain + icon: public-domain-only-access-no-download + - ref: facsimiles - iconColor: orange - title: "Access to protected data determined only by Impresso partners. No download possible" + icon: restricted-only-access-no-download + + - ref: audio-public-domain + icon: public-domain-only-access-no-download + - ref: audio - iconColor: orange - title: "download" + icon: restricted-only-access-no-download + + - ref: transcripts-public-domain - ref: transcripts + icon: restricted-only-access-download + + - ref: images-public-domain - ref: images - iconColor: orange - title: "download" + icon: restricted-only-access-download + + - ref: semantic-enrichments-public-domain - ref: semantic-enrichments requirements: diff --git a/src/content/plans/03-student-user.mdx b/src/content/plans/03-student-user.mdx index 5c57094..4716b4f 100644 --- a/src/content/plans/03-student-user.mdx +++ b/src/content/plans/03-student-user.mdx @@ -7,6 +7,32 @@ features: - ref: create-store-export-collections - ref: generate-api-keys + - ref: metadata-public-domain + - ref: metadata + + - ref: facsimiles-public-domain + icon: public-domain-only-access-no-download + + - ref: facsimiles + icon: restricted-only-access-no-download + + - ref: audio-public-domain + icon: public-domain-only-access-no-download + + - ref: audio + icon: restricted-only-access-no-download + + - ref: transcripts-public-domain + - ref: transcripts + icon: restricted-only-access-download + + - ref: images-public-domain + - ref: images + icon: restricted-only-access-download + + - ref: semantic-enrichments-public-domain + - ref: semantic-enrichments + requirements: - terms-of-use - impresso-account diff --git a/src/content/plans/04-academic-user.mdx b/src/content/plans/04-academic-user.mdx index 1e1cc94..b09fde4 100644 --- a/src/content/plans/04-academic-user.mdx +++ b/src/content/plans/04-academic-user.mdx @@ -6,8 +6,32 @@ features: - ref: explore-all-features - ref: create-store-export-collections - ref: generate-api-keys + - ref: metadata-public-domain - ref: metadata + + - ref: facsimiles-public-domain + icon: public-domain-only-access-no-download + - ref: facsimiles + icon: restricted-only-access-no-download + + - ref: audio-public-domain + icon: public-domain-only-access-no-download + + - ref: audio + icon: restricted-only-access-no-download + + - ref: transcripts-public-domain + - ref: transcripts + icon: restricted-only-access-download + + - ref: images-public-domain + - ref: images + icon: restricted-only-access-download + + - ref: semantic-enrichments-public-domain + - ref: semantic-enrichments + requirements: - terms-of-use - impresso-account diff --git a/src/content/plans/05-academic-user-plus.mdx b/src/content/plans/05-academic-user-plus.mdx index 72729a9..245519e 100644 --- a/src/content/plans/05-academic-user-plus.mdx +++ b/src/content/plans/05-academic-user-plus.mdx @@ -6,8 +6,32 @@ features: - ref: explore-all-features - ref: create-store-export-collections - ref: generate-api-keys + + - ref: metadata-public-domain - ref: metadata + + - ref: facsimiles-public-domain + icon: public-domain-only-access-no-download + - ref: facsimiles + icon: restricted-only-access-no-download + + - ref: audio-public-domain + icon: public-domain-only-access-no-download + + - ref: audio + icon: restricted-only-access-no-download + + - ref: transcripts-public-domain + - ref: transcripts + icon: restricted-only-access-download + + - ref: images-public-domain + - ref: images + icon: restricted-only-access-download + + - ref: semantic-enrichments-public-domain + - ref: semantic-enrichments requirements: - terms-of-use