UI tweaks

This commit is contained in:
x032205
2025-05-23 20:18:05 -04:00
parent df57364985
commit 82f6c9fb58
2 changed files with 36 additions and 64 deletions
@@ -1,6 +1,5 @@
import { faWrench } from "@fortawesome/free-solid-svg-icons"; import { faWrench } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { twMerge } from "tailwind-merge";
import { Spinner, Tooltip } from "@app/components/v2"; import { Spinner, Tooltip } from "@app/components/v2";
import { useSubscription } from "@app/context"; import { useSubscription } from "@app/context";
@@ -34,12 +33,6 @@ export const SecretSyncSelect = ({ onSelect }: Props) => {
{secretSyncOptions?.map(({ destination, enterprise }) => { {secretSyncOptions?.map(({ destination, enterprise }) => {
const { image, name } = SECRET_SYNC_MAP[destination]; const { image, name } = SECRET_SYNC_MAP[destination];
return ( return (
<Tooltip
key={destination}
content={
enterprise && !subscription.enterpriseSecretSyncs ? "Enterprise Plan Only" : undefined
}
>
<button <button
type="button" type="button"
onClick={() => onClick={() =>
@@ -47,12 +40,7 @@ export const SecretSyncSelect = ({ onSelect }: Props) => {
? handlePopUpOpen("upgradePlan") ? handlePopUpOpen("upgradePlan")
: onSelect(destination) : onSelect(destination)
} }
className={twMerge( className="group relative flex h-28 cursor-pointer flex-col items-center justify-center overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600"
"group relative flex h-28 cursor-pointer flex-col items-center justify-center overflow-hidden rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600",
enterprise && !subscription.enterpriseSecretSyncs
? "border-0 bg-opacity-0 opacity-40"
: ""
)}
> >
<img <img
src={`/images/integrations/${image}`} src={`/images/integrations/${image}`}
@@ -65,7 +53,6 @@ export const SecretSyncSelect = ({ onSelect }: Props) => {
{name} {name}
</div> </div>
</button> </button>
</Tooltip>
); );
})} })}
<UpgradePlanModal <UpgradePlanModal
@@ -1,6 +1,5 @@
import { faWrench } from "@fortawesome/free-solid-svg-icons"; import { faWrench } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { twMerge } from "tailwind-merge";
import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal"; import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
import { Spinner, Tooltip } from "@app/components/v2"; import { Spinner, Tooltip } from "@app/components/v2";
@@ -35,14 +34,6 @@ export const AppConnectionsSelect = ({ onSelect }: Props) => {
const { image, name, size = 50, enterprise = false } = APP_CONNECTION_MAP[option.app]; const { image, name, size = 50, enterprise = false } = APP_CONNECTION_MAP[option.app];
return ( return (
<Tooltip
key={option.app}
content={
enterprise && !subscription.enterpriseAppConnections
? "Enterprise Plan Only"
: undefined
}
>
<button <button
type="button" type="button"
onClick={() => onClick={() =>
@@ -50,12 +41,7 @@ export const AppConnectionsSelect = ({ onSelect }: Props) => {
? handlePopUpOpen("upgradePlan") ? handlePopUpOpen("upgradePlan")
: onSelect(option.app) : onSelect(option.app)
} }
className={twMerge( className="group relative flex h-28 cursor-pointer flex-col items-center justify-center rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600"
"group relative flex h-28 cursor-pointer flex-col items-center justify-center rounded-md border border-mineshaft-600 bg-mineshaft-700 p-4 duration-200 hover:bg-mineshaft-600",
enterprise && !subscription.enterpriseAppConnections
? "border-0 bg-opacity-0 opacity-40"
: ""
)}
> >
<img <img
src={`/images/integrations/${image}`} src={`/images/integrations/${image}`}
@@ -69,7 +55,6 @@ export const AppConnectionsSelect = ({ onSelect }: Props) => {
{name} {name}
</div> </div>
</button> </button>
</Tooltip>
); );
})} })}
<UpgradePlanModal <UpgradePlanModal