mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-11 11:29:21 +00:00
Added translations to the sidebar
This commit is contained in:
Vladyslav Matsiiako
@@ -1,9 +1,13 @@
|
||||
import { useTranslation } from "next-i18next";
|
||||
|
||||
/**
|
||||
* This is the text field where people can add comments to particular secrets.
|
||||
*/
|
||||
const CommentField = ({ comment, modifyComment, position }: { comment: string; modifyComment: (value: string, posistion: number) => void; position: number;}) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return <div className={`relative mt-4 px-4 pt-4`}>
|
||||
<p className='text-sm text-bunker-300'>Comments & notes</p>
|
||||
<p className='text-sm text-bunker-300'>{t("dashboard:sidebar.comments")}</p>
|
||||
<textarea
|
||||
className="bg-bunker-800 h-32 w-full bg-bunker-800 p-2 rounded-md border border-mineshaft-500 text-sm text-bunker-300 outline-none focus:ring-2 ring-primary-800 ring-opacity-70"
|
||||
value={comment}
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { Fragment,useState } from 'react';
|
||||
import { useTranslation } from "next-i18next";
|
||||
import { faShuffle } from '@fortawesome/free-solid-svg-icons';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import { Menu, Transition } from '@headlessui/react';
|
||||
@@ -10,6 +11,7 @@ import { Menu, Transition } from '@headlessui/react';
|
||||
*/
|
||||
const GenerateSecretMenu = ({ modifyValue, position }: { modifyValue: (value: string, position: number) => void; position: number; }) => {
|
||||
const [randomStringLength, setRandomStringLength] = useState(32);
|
||||
const { t } = useTranslation();
|
||||
|
||||
return <Menu as="div" className="relative inline-block text-left">
|
||||
<div>
|
||||
@@ -51,8 +53,8 @@ const GenerateSecretMenu = ({ modifyValue, position }: { modifyValue: (value: st
|
||||
icon={faShuffle}
|
||||
/>
|
||||
<div className="text-sm justify-between flex flex-row w-full">
|
||||
<p>Generate Random Hex</p>
|
||||
<p>digits</p>
|
||||
<p>{t("dashboard:sidebar.generate-random-hex")}</p>
|
||||
<p>{t("dashboard:sidebar.digits")}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-row absolute bottom-[0.4rem] right-[3.3rem] w-16 bg-bunker-800 border border-chicago-700 rounded-md text-bunker-200 ">
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { useState } from 'react';
|
||||
import { useTranslation } from "next-i18next";
|
||||
import { faX } from '@fortawesome/free-solid-svg-icons';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import SecretVersionList from 'ee/components/SecretVersionList';
|
||||
@@ -69,17 +70,18 @@ const SideBar = ({
|
||||
setSharedToHide
|
||||
}: SideBarProps) => {
|
||||
const [overrideEnabled, setOverrideEnabled] = useState(data.map(secret => secret.type).includes("personal"));
|
||||
const { t } = useTranslation();
|
||||
|
||||
return <div className='absolute border-l border-mineshaft-500 bg-bunker fixed h-full w-96 top-14 right-0 z-50 shadow-xl flex flex-col justify-between'>
|
||||
<div className='h-min overflow-y-auto'>
|
||||
<div className="flex flex-row px-4 py-3 border-b border-mineshaft-500 justify-between items-center">
|
||||
<p className="font-semibold text-lg text-bunker-200">Secret</p>
|
||||
<p className="font-semibold text-lg text-bunker-200">{t("dashboard:sidebar.secret")}</p>
|
||||
<div className='p-1' onClick={() => toggleSidebar("None")}>
|
||||
<FontAwesomeIcon icon={faX} className='w-4 h-4 text-bunker-300 cursor-pointer'/>
|
||||
</div>
|
||||
</div>
|
||||
<div className='mt-4 px-4 pointer-events-none'>
|
||||
<p className='text-sm text-bunker-300'>Key</p>
|
||||
<p className='text-sm text-bunker-300'>{t("dashboard:sidebar.key")}</p>
|
||||
<DashboardInputField
|
||||
onChangeHandler={modifyKey}
|
||||
type="varName"
|
||||
@@ -91,7 +93,7 @@ const SideBar = ({
|
||||
</div>
|
||||
{data.filter(secret => secret.type == "shared")[0]?.value
|
||||
? <div className={`relative mt-2 px-4 ${overrideEnabled && "opacity-40 pointer-events-none"} duration-200`}>
|
||||
<p className='text-sm text-bunker-300'>Value</p>
|
||||
<p className='text-sm text-bunker-300'>{t("dashboard:sidebar.value")}</p>
|
||||
<DashboardInputField
|
||||
onChangeHandler={modifyValue}
|
||||
type="value"
|
||||
@@ -105,13 +107,13 @@ const SideBar = ({
|
||||
</div>
|
||||
</div>
|
||||
: <div className='px-4 text-sm text-bunker-300 pt-4'>
|
||||
<span className='py-0.5 px-1 rounded-md bg-primary-200/10 mr-1'>Note:</span>
|
||||
This secret is personal. It is not shared with any of your teammates.
|
||||
<span className='py-0.5 px-1 rounded-md bg-primary-200/10 mr-1'>{t("common:note")}:</span>
|
||||
{t("dashboard:sidebar.personal-explanation")}
|
||||
</div>}
|
||||
<div className='mt-4 px-4'>
|
||||
{data.filter(secret => secret.type == "shared")[0]?.value &&
|
||||
<div className='flex flex-row items-center justify-between my-2 pl-1 pr-2'>
|
||||
<p className='text-sm text-bunker-300'>Override value with a personal value</p>
|
||||
<p className='text-sm text-bunker-300'>{t("dashboard:sidebar.override")}</p>
|
||||
<Toggle
|
||||
enabled={overrideEnabled}
|
||||
setEnabled={setOverrideEnabled}
|
||||
@@ -154,7 +156,7 @@ const SideBar = ({
|
||||
</div>
|
||||
<div className={`flex justify-start max-w-sm mt-4 px-4 mt-full mb-[4.7rem]`}>
|
||||
<Button
|
||||
text="Save Changes"
|
||||
text={String(t("common:save-changes"))}
|
||||
onButtonPressed={savePush}
|
||||
color="primary"
|
||||
size="md"
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useRouter } from 'next/router';
|
||||
import { useTranslation } from "next-i18next";
|
||||
import { faCircle, faDotCircle } from '@fortawesome/free-solid-svg-icons';
|
||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
||||
import getSecretVersions from 'ee/api/secrets/GetSecretVersions';
|
||||
@@ -25,6 +26,7 @@ interface EncrypetedSecretVersionListProps {
|
||||
*/
|
||||
const SecretVersionList = ({ secretId }: { secretId: string; }) => {
|
||||
const router = useRouter();
|
||||
const { t } = useTranslation();
|
||||
const [secretVersions, setSecretVersions] = useState<DecryptedSecretVersionListProps[]>([{createdAt: "123", value: "124"}]);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -67,7 +69,7 @@ const SecretVersionList = ({ secretId }: { secretId: string; }) => {
|
||||
}, []);
|
||||
|
||||
return <div className='w-full h-52 px-4 mt-4 text-sm text-bunker-300 overflow-x-none'>
|
||||
<p className=''>Version History</p>
|
||||
<p className=''>{t("dashboard:sidebar.version-history")}</p>
|
||||
<div className='p-1 rounded-md bg-bunker-800 border border-mineshaft-500 overflow-x-none'>
|
||||
<div className='h-48 overflow-y-auto overflow-x-none'>
|
||||
{secretVersions?.sort((a, b) => b.createdAt.localeCompare(a.createdAt))
|
||||
|
||||
@@ -422,8 +422,8 @@ export default function Dashboard() {
|
||||
<title>{t("common:head-title", { title: t("dashboard:title") })}</title>
|
||||
<link rel="icon" href="/infisical.ico" />
|
||||
<meta property="og:image" content="/images/message.png" />
|
||||
<meta property="og:title" content={t("dashboard:og-title")} />
|
||||
<meta name="og:description" content={t("dashboard:og-description")} />
|
||||
<meta property="og:title" content={String(t("dashboard:og-title"))} />
|
||||
<meta name="og:description" content={String(t("dashboard:og-description"))} />
|
||||
</Head>
|
||||
<div className="flex flex-row">
|
||||
{sidebarSecretId != "None" && <SideBar
|
||||
@@ -494,13 +494,13 @@ export default function Dashboard() {
|
||||
{(data?.length !== 0 || buttonReady) && (
|
||||
<div className={`flex justify-start max-w-sm mt-2`}>
|
||||
<Button
|
||||
text={t("common:save-changes")}
|
||||
text={String(t("common:save-changes"))}
|
||||
onButtonPressed={savePush}
|
||||
color="primary"
|
||||
size="md"
|
||||
active={buttonReady}
|
||||
iconDisabled={faCheck}
|
||||
textDisabled={t("common:saved")}
|
||||
textDisabled={String(t("common:saved"))}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
@@ -525,7 +525,7 @@ export default function Dashboard() {
|
||||
className="pl-2 text-gray-400 rounded-r-md bg-white/5 w-full h-full outline-none"
|
||||
value={searchKeys}
|
||||
onChange={(e) => setSearchKeys(e.target.value)}
|
||||
placeholder={t("dashboard:search-keys")}
|
||||
placeholder={String(t("dashboard:search-keys"))}
|
||||
/>
|
||||
</div>
|
||||
<div className="ml-2 min-w-max flex flex-row items-start justify-start">
|
||||
@@ -558,7 +558,7 @@ export default function Dashboard() {
|
||||
</div>
|
||||
<div className="relative ml-2 min-w-max flex flex-row items-start justify-end">
|
||||
<Button
|
||||
text={t("dashboard:add-key")}
|
||||
text={String(t("dashboard:add-key"))}
|
||||
onButtonPressed={addRow}
|
||||
color="mineshaft"
|
||||
icon={faPlus}
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
"last-name": "Last Name",
|
||||
"logout": "Log Out",
|
||||
"validate-required": "Please input your {{name}}",
|
||||
|
||||
"maintenance-alert": "We are experiencing minor technical difficulties. We are working on solving it right now. Please come back in a few minutes.",
|
||||
"click-to-copy": "Click to copy",
|
||||
"project-id": "Project ID",
|
||||
@@ -22,5 +21,6 @@
|
||||
"environment": "Environment",
|
||||
"expired-in": "Expires in",
|
||||
"language": "Language",
|
||||
"search": "Search..."
|
||||
"search": "Search...",
|
||||
"note": "Note"
|
||||
}
|
||||
|
||||
@@ -15,5 +15,16 @@
|
||||
"title": "Good job!",
|
||||
"line1": "Congrats on adding more secrets.",
|
||||
"line2": "Here is how to connect them to your codebase."
|
||||
},
|
||||
"sidebar": {
|
||||
"secret": "Secret",
|
||||
"key": "Key",
|
||||
"value": "Value",
|
||||
"override": "Override value with a personal value",
|
||||
"version-history": "Version History",
|
||||
"comments": "Comments & Notes",
|
||||
"personal-explanation": "This secret is personal. It is not shared with any of your teammates.",
|
||||
"generate-random-hex": "Generate Random Hex",
|
||||
"digits": "digits"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -18,9 +18,9 @@
|
||||
"role": "Role",
|
||||
"role_admin": "admin",
|
||||
"display-name": "표시 이름",
|
||||
|
||||
"environment": "환경",
|
||||
"expired-in": "만료 기한:",
|
||||
"language": "언어",
|
||||
"search": "검색하기..."
|
||||
"search": "검색하기...",
|
||||
"note": "Note"
|
||||
}
|
||||
|
||||
@@ -15,5 +15,16 @@
|
||||
"title": "좋았어요!",
|
||||
"line1": "더 많은 시크릿들을 추가한 것을 축하합니다.",
|
||||
"line2": "코드와 연결하는 사용하는 방법을 한번 알아보지 않을래요?"
|
||||
},
|
||||
"sidebar": {
|
||||
"secret": "Secret",
|
||||
"key": "Key",
|
||||
"value": "Value",
|
||||
"override": "Override value with a personal value",
|
||||
"version-history": "Version History",
|
||||
"comments": "Comments & Notes",
|
||||
"personal-explanation": "This secret is personal. It is not shared with any of your teammates.",
|
||||
"generate-random-hex": "Generate Random Hex",
|
||||
"digits": "digits"
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user