Remove useless card

Signed-off-by: Bryan Frimin <bryan@getprobo.com>
This commit is contained in:
Bryan Frimin
2026-03-25 08:19:28 +01:00
parent 535d5e99d0
commit 81a4ec7c6e
2 changed files with 128 additions and 132 deletions

View File

@@ -1,5 +1,5 @@
import { useTranslate } from "@probo/i18n"; import { useTranslate } from "@probo/i18n";
import { Button, Card, Dropzone, IconTrashCan, Spinner, useToast } from "@probo/ui"; import { Button, Dropzone, IconTrashCan, Spinner, useToast } from "@probo/ui";
import { useFragment } from "react-relay"; import { useFragment } from "react-relay";
import { graphql } from "relay-runtime"; import { graphql } from "relay-runtime";
@@ -88,88 +88,86 @@ export function CompliancePageNDASection(props: { fragmentRef: CompliancePageNDA
</h2> </h2>
{(isUploadingNDA || isDeletingNDA) && <Spinner />} {(isUploadingNDA || isDeletingNDA) && <Spinner />}
</div> </div>
<Card padded className="space-y-4"> <div className="space-y-2">
<div className="space-y-2"> {!organization.compliancePage?.ndaFileName
{!organization.compliancePage?.ndaFileName && organization.compliancePage?.canUploadNDA
&& organization.compliancePage?.canUploadNDA ? (
? ( <p className="text-sm text-txt-tertiary">
<p className="text-sm text-txt-tertiary"> {__(
{__( "Upload a Non-Disclosure Agreement that visitors must accept before accessing your compliance page",
"Upload a Non-Disclosure Agreement that visitors must accept before accessing your compliance page", )}
)} </p>
</p> )
) : (
: ( <></>
<></> )}
)} {organization.compliancePage?.ndaFileName
{organization.compliancePage?.ndaFileName ? (
? ( <div className="space-y-3">
<div className="space-y-3"> <div className="flex items-center justify-between">
<div className="flex items-center justify-between"> <div className="space-y-1">
<div className="space-y-1"> <div className="flex items-center gap-2">
<div className="flex items-center gap-2"> <p className="text-sm font-medium">
<p className="text-sm font-medium"> {organization.compliancePage.ndaFileName
{organization.compliancePage.ndaFileName || __("Non-Disclosure Agreement")}
|| __("Non-Disclosure Agreement")}
</p>
</div>
<p className="text-xs text-txt-tertiary">
{__(
"Visitors will need to accept this NDA before accessing your compliance page",
)}
</p> </p>
</div> </div>
<div className="flex items-center gap-2"> <p className="text-xs text-txt-tertiary">
<Button {__(
type="button" "Visitors will need to accept this NDA before accessing your compliance page",
variant="secondary"
onClick={() => {
if (organization.compliancePage?.ndaFileUrl) {
window.open(
organization.compliancePage.ndaFileUrl,
"_blank",
"noopener,noreferrer",
);
}
}}
>
{__("Download PDF")}
</Button>
{organization.compliancePage?.canDeleteNDA && (
<Button
variant="quaternary"
icon={IconTrashCan}
onClick={() => void handleNDADelete()}
disabled={isDeletingNDA}
/>
)} )}
</div> </p>
</div>
<div className="flex items-center gap-2">
<Button
type="button"
variant="secondary"
onClick={() => {
if (organization.compliancePage?.ndaFileUrl) {
window.open(
organization.compliancePage.ndaFileUrl,
"_blank",
"noopener,noreferrer",
);
}
}}
>
{__("Download PDF")}
</Button>
{organization.compliancePage?.canDeleteNDA && (
<Button
variant="quaternary"
icon={IconTrashCan}
onClick={() => void handleNDADelete()}
disabled={isDeletingNDA}
/>
)}
</div> </div>
</div> </div>
) </div>
: ( )
<> : (
{organization.compliancePage?.canUploadNDA <>
? ( {organization.compliancePage?.canUploadNDA
<Dropzone ? (
description={__("Upload PDF files up to 10MB")} <Dropzone
isUploading={isUploadingNDA} description={__("Upload PDF files up to 10MB")}
onDrop={files => void handleNDAUpload(files)} isUploading={isUploadingNDA}
accept={{ onDrop={files => void handleNDAUpload(files)}
"application/pdf": [".pdf"], accept={{
}} "application/pdf": [".pdf"],
maxSize={10} }}
/> maxSize={10}
) />
: ( )
<p className="text-sm text-txt-tertiary"> : (
{__("No NDA file uploaded")} <p className="text-sm text-txt-tertiary">
</p> {__("No NDA file uploaded")}
)} </p>
</> )}
)} </>
</div> )}
</Card> </div>
</div> </div>
); );
} }

View File

@@ -35,60 +35,58 @@ export function CompliancePageSlackSection(props: { fragmentRef: CompliancePageS
return ( return (
<div className="space-y-4"> <div className="space-y-4">
<h2 className="text-base font-medium">{__("Integrations")}</h2> <h2 className="text-base font-medium">{__("Integrations")}</h2>
<Card padded> <div className="space-y-2">
<div className="space-y-2"> {organization.slackConnections.edges.map(({ node: slackConnection }) => (
{organization.slackConnections.edges.map(({ node: slackConnection }) => ( <Card
<Card key={slackConnection.id}
key={slackConnection.id} padded
padded className="flex items-center gap-3"
className="flex items-center gap-3" >
> <div className="h-10 w-10 flex items-center justify-center bg-subtle rounded">
<div className="h-10 w-10 flex items-center justify-center bg-subtle rounded"> <Slack className="h-6 w-6" />
<Slack className="h-6 w-6" /> </div>
</div> <div className="mr-auto">
<div className="mr-auto"> <h3 className="text-base font-semibold">Slack</h3>
<h3 className="text-base font-semibold">Slack</h3> <p className="text-sm text-txt-tertiary">
<p className="text-sm text-txt-tertiary"> {sprintf(
{sprintf( __("Connected on %s"),
__("Connected on %s"), dateTimeFormat(slackConnection.createdAt),
dateTimeFormat(slackConnection.createdAt), )}
)} {slackConnection.channel && (
{slackConnection.channel && ( <>
<> {" • "}
{" • "} {sprintf(__("Channel: %s"), slackConnection.channel)}
{sprintf(__("Channel: %s"), slackConnection.channel)} </>
</> )}
)} </p>
</p> </div>
</div> <div>
<div> <Badge variant="success" size="md">
<Badge variant="success" size="md"> {__("Connected")}
{__("Connected")} </Badge>
</Badge> </div>
</div> </Card>
</Card> ))}
))} {organization.compliancePage?.canUpdate && organization.slackConnections.edges.length === 0 && (
{organization.compliancePage?.canUpdate && organization.slackConnections.edges.length === 0 && ( <Card
<Card padded
padded className="flex items-center gap-3"
className="flex items-center gap-3" >
> <div className="h-10 w-10 flex items-center justify-center bg-subtle rounded">
<div className="h-10 w-10 flex items-center justify-center bg-subtle rounded"> <Slack className="h-6 w-6" />
<Slack className="h-6 w-6" /> </div>
</div> <div className="mr-auto">
<div className="mr-auto"> <h3 className="text-base font-semibold">Slack</h3>
<h3 className="text-base font-semibold">Slack</h3> <p className="text-sm text-txt-tertiary">
<p className="text-sm text-txt-tertiary"> {__("Manage your compliance page access with slack")}
{__("Manage your compliance page access with slack")} </p>
</p> </div>
</div> <Button variant="secondary" asChild>
<Button variant="secondary" asChild> <a href={getSlackConnectionUrl(organizationId)}>{__("Connect")}</a>
<a href={getSlackConnectionUrl(organizationId)}>{__("Connect")}</a> </Button>
</Button> </Card>
</Card> )}
)} </div>
</div>
</Card>
</div> </div>
); );
} }