awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-08 04:27:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4451 from Infisical/external-imports-ui-improvement

Browse Source 
improvement(frontend): Clarify external import provider names and add logos
This commit is contained in:
Scott Wilson
2025-09-01 10:04:47 -07:00
committed by GitHub
parent 6702498028 d931725930
commit a3c6b1134b
2 changed files with 12 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/public/images/integrations/EnvKey.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

frontend/src/pages/organization/SettingsPage/components/ExternalMigrationsTab/components/SelectImportFromPlatformModal.tsx
+12 -8
View File
@@ -1,6 +1,4 @@
import { useState } from "react"; import { useState } from "react";
import { faKey, faVault } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { AnimatePresence, motion } from "framer-motion"; import { AnimatePresence, motion } from "framer-motion";
import { Modal, ModalContent } from "@app/components/v2"; import { Modal, ModalContent } from "@app/components/v2";
@@ -20,14 +18,16 @@ enum WizardSteps {
const PLATFORM_LIST = [ const PLATFORM_LIST = [
{ {
icon: faKey, image: "/images/integrations/EnvKey.png",
platform: "env-key", platform: "env-key",
title: "Env Key" title: "EnvKey",
size: 34
}, },
{ {
icon: faVault, image: "/images/integrations/Vault.png",
platform: "vault", platform: "vault",
title: "Vault" title: "HCP Vault",
size: 40
} }
] as const; ] as const;
@@ -67,7 +67,7 @@ export const SelectImportFromPlatformModal = ({ isOpen, onToggle }: Props) => {
{PLATFORM_LIST.map((platform, idx) => ( {PLATFORM_LIST.map((platform, idx) => (
<div <div
key={`platform-${idx + 1}`} key={`platform-${idx + 1}`}
className="flex h-28 w-32 cursor-pointer flex-col items-center space-y-4 rounded border border-mineshaft-500 bg-bunker-600 p-6 transition-all hover:border-primary/70 hover:bg-primary/10 hover:text-white" className="flex h-28 w-32 cursor-pointer flex-col items-center justify-between rounded border border-mineshaft-500 bg-mineshaft-700 p-6 py-5 transition-all hover:border-primary/70 hover:bg-primary/10 hover:text-white"
role="button" role="button"
tabIndex={0} tabIndex={0}
onClick={() => { onClick={() => {
@@ -81,7 +81,11 @@ export const SelectImportFromPlatformModal = ({ isOpen, onToggle }: Props) => {
} }
}} }}
> >
<FontAwesomeIcon icon={platform.icon} size="lg" /> <img
src={platform.image}
alt={`${platform.title} logo`}
style={{ width: platform.size }}
/>
<div className="whitespace-pre-wrap text-center text-sm">{platform.title}</div> <div className="whitespace-pre-wrap text-center text-sm">{platform.title}</div>
</div> </div>
))} ))}