awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-05 22:26:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(frontend): update some files about translate

Browse Source
This commit is contained in:
이강준
2022-12-26 22:14:42 +09:00
parent 5b8337ac41
commit 991e4b7bc6
6 changed files with 119 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/basic/dialog/AddIncidentContactDialog.js
+2 -2
View File
@@ -1,5 +1,5 @@
import { Fragment, useState } from "react"; import { Fragment, useState } from "react";
import useTranslate from "next-translate/useTranslation"; import { useTranslation } from "next-i18next";
import { Dialog, Transition } from "@headlessui/react"; import { Dialog, Transition } from "@headlessui/react";
import addIncidentContact from "~/pages/api/organization/addIncidentContact"; import addIncidentContact from "~/pages/api/organization/addIncidentContact";
@@ -15,7 +15,7 @@ const AddIncidentContactDialog = ({
setIncidentContacts, setIncidentContacts,
}) => { }) => {
let [incidentContactEmail, setIncidentContactEmail] = useState(""); let [incidentContactEmail, setIncidentContactEmail] = useState("");
const { t } = useTranslate(); const { t } = useTranslation();
const submit = () => { const submit = () => {
setIncidentContacts( setIncidentContacts(
frontend/components/basic/dialog/AddProjectMemberDialog.js
+1 -2
View File
@@ -1,7 +1,6 @@
import { Fragment, useState } from "react"; import { Fragment, useState } from "react";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import Trans from "next-translate/Trans"; import { Trans, useTranslation } from "next-i18next";
import { useTranslation } from "next-i18next";
import { Dialog, Transition } from "@headlessui/react"; import { Dialog, Transition } from "@headlessui/react";
import Button from "../buttons/Button"; import Button from "../buttons/Button";
frontend/pages/login.tsx
+55 -33
View File
@@ -1,24 +1,34 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from "react";
import Head from 'next/head'; import Head from "next/head";
import Image from 'next/image'; import Image from "next/image";
import Link from 'next/link'; import Link from "next/link";
import { useRouter } from 'next/router'; import { useRouter } from "next/router";
import { faWarning } from '@fortawesome/free-solid-svg-icons'; import { useTranslation } from "next-i18next";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { faWarning } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import Button from '~/components/basic/buttons/Button'; import Button from "~/components/basic/buttons/Button";
import Error from '~/components/basic/Error'; import Error from "~/components/basic/Error";
import InputField from '~/components/basic/InputField'; import InputField from "~/components/basic/InputField";
import attemptLogin from '~/utilities/attemptLogin'; import { getTranslatedStaticProps } from "~/components/utilities/withTranslateProps";
import attemptLogin from "~/utilities/attemptLogin";
import getWorkspaces from './api/workspace/getWorkspaces'; import getWorkspaces from "./api/workspace/getWorkspaces";
import ListBox from "~/components/basic/Listbox";
export default function Login() { export default function Login() {
const [email, setEmail] = useState(''); const [email, setEmail] = useState("");
const [password, setPassword] = useState(''); const [password, setPassword] = useState("");
const [errorLogin, setErrorLogin] = useState(false); const [errorLogin, setErrorLogin] = useState(false);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const router = useRouter(); const router = useRouter();
const { t } = useTranslation();
const lang = router.locale ?? "en";
const setLanguage = async (to: string) => {
router.push("/login", "/login", { locale: to });
localStorage.setItem("lang", to);
};
useEffect(() => { useEffect(() => {
const redirectToDashboard = async () => { const redirectToDashboard = async () => {
@@ -26,9 +36,9 @@ export default function Login() {
try { try {
const userWorkspaces = await getWorkspaces(); const userWorkspaces = await getWorkspaces();
userWorkspace = userWorkspaces[0]._id; userWorkspace = userWorkspaces[0]._id;
router.push('/dashboard/' + userWorkspace); router.push("/dashboard/" + userWorkspace);
} catch (error) { } catch (error) {
console.log('Error - Not logged in yet'); console.log("Error - Not logged in yet");
} }
}; };
redirectToDashboard(); redirectToDashboard();
@@ -49,7 +59,7 @@ export default function Login() {
setErrorLogin, setErrorLogin,
router, router,
false, false,
true, true
).then(() => { ).then(() => {
setTimeout(function () { setTimeout(function () {
setIsLoading(false); setIsLoading(false);
@@ -60,14 +70,11 @@ export default function Login() {
return ( return (
<div className="bg-bunker-800 h-screen flex flex-col justify-start px-6"> <div className="bg-bunker-800 h-screen flex flex-col justify-start px-6">
<Head> <Head>
<title>Login</title> <title>{t("common:head-title", { title: t("login:title") })}</title>
<link rel="icon" href="/infisical.ico" /> <link rel="icon" href="/infisical.ico" />
<meta property="og:image" content="/images/message.png" /> <meta property="og:image" content="/images/message.png" />
<meta property="og:title" content="Log In to Infisical" /> <meta property="og:title" content={t("login:og-title") ?? ""} />
<meta <meta name="og:description" content={t("login:og-description") ?? ""} />
name="og:description"
content="Infisical a simple end-to-end encrypted platform that enables teams to sync and manage their .env files."
/>
</Head> </Head>
<Link href="/"> <Link href="/">
<div className="flex justify-center mb-8 mt-20 cursor-pointer"> <div className="flex justify-center mb-8 mt-20 cursor-pointer">
@@ -80,15 +87,16 @@ export default function Login() {
</div> </div>
</Link> </Link>
<form <form
onChange={() => setErrorLogin(false)} onSubmit={(e) => e.preventDefault()} onChange={() => setErrorLogin(false)}
onSubmit={(e) => e.preventDefault()}
> >
<div className="bg-bunker w-full max-w-md mx-auto h-7/12 py-4 pt-8 px-6 rounded-xl drop-shadow-xl"> <div className="bg-bunker w-full max-w-md mx-auto h-7/12 py-4 pt-8 px-6 rounded-xl drop-shadow-xl">
<p className="text-3xl w-max mx-auto flex justify-center font-semibold text-bunker-100 mb-6"> <p className="text-3xl w-max mx-auto flex justify-center font-semibold text-bunker-100 mb-6">
Log in to your account {t("login:login-to")}
</p> </p>
<div className="flex items-center justify-center w-full md:p-2 rounded-lg mt-4 md:mt-0 max-h-24 md:max-h-28"> <div className="flex items-center justify-center w-full md:p-2 rounded-lg mt-4 md:mt-0 max-h-24 md:max-h-28">
<InputField <InputField
label="Email" label={t("common:email")}
onChangeHandler={setEmail} onChangeHandler={setEmail}
type="email" type="email"
value={email} value={email}
@@ -99,7 +107,7 @@ export default function Login() {
</div> </div>
<div className="relative flex items-center justify-center w-full md:p-2 rounded-lg md:mt-2 mt-6 max-h-24 md:max-h-28"> <div className="relative flex items-center justify-center w-full md:p-2 rounded-lg md:mt-2 mt-6 max-h-24 md:max-h-28">
<InputField <InputField
label="Password" label={t("common:password")}
onChangeHandler={setPassword} onChangeHandler={setPassword}
type="password" type="password"
value={password} value={password}
@@ -112,12 +120,14 @@ export default function Login() {
<Link href="/verify-email">Forgot password?</Link> <Link href="/verify-email">Forgot password?</Link>
</div> </div>
</div> </div>
{!isLoading && errorLogin && <Error text="Your email and/or password are wrong." />} {!isLoading && errorLogin && (
<Error text="Your email and/or password are wrong." />
)}
<div className="flex flex-col items-center justify-center w-full md:p-2 max-h-20 max-w-md mt-4 mx-auto text-sm"> <div className="flex flex-col items-center justify-center w-full md:p-2 max-h-20 max-w-md mt-4 mx-auto text-sm">
<div className="text-l mt-6 m-8 px-8 py-3 text-lg"> <div className="text-l mt-6 m-8 px-8 py-3 text-lg">
<Button <Button
type="submit" type="submit"
text="Log In" text={t("login:login") ?? ""}
onButtonPressed={loginCheck} onButtonPressed={loginCheck}
loading={isLoading} loading={isLoading}
size="lg" size="lg"
@@ -131,21 +141,33 @@ export default function Login() {
{false && ( {false && (
<div className="w-full p-2 flex flex-row items-center bg-white/10 text-gray-300 rounded-md max-w-md mx-auto mt-4"> <div className="w-full p-2 flex flex-row items-center bg-white/10 text-gray-300 rounded-md max-w-md mx-auto mt-4">
<FontAwesomeIcon icon={faWarning} className="ml-2 mr-6 text-6xl" /> <FontAwesomeIcon icon={faWarning} className="ml-2 mr-6 text-6xl" />
We are experiencing minor technical difficulties. We are working on {t("common:maintenance-alert")}
solving it right now. Please come back in a few minutes.
</div> </div>
)} )}
<div className="flex flex-row items-center justify-center md:pb-4 mt-4"> <div className="flex flex-row items-center justify-center md:pb-4 mt-4">
<p className="text-sm flex justify-center text-gray-400 w-max"> <p className="text-sm flex justify-center text-gray-400 w-max">
Need an Infisical account? {t("login:need-account")}
</p> </p>
<Link href="/signup"> <Link href="/signup">
<button className="text-primary-700 hover:text-primary duration-200 font-normal text-sm underline-offset-4 ml-1.5"> <button className="text-primary-700 hover:text-primary duration-200 font-normal text-sm underline-offset-4 ml-1.5">
Sign up here. {t("login:create-account")}
</button> </button>
</Link> </Link>
</div> </div>
</form> </form>
<div className="mt-4 flex items-center justify-center w-full">
<div className="w-48 mx-auto">
<ListBox
selected={lang}
onChange={setLanguage}
data={["en", "ko"]}
isFull
text={`${t("common:language")}: `}
/>
</div>
</div>
</div> </div>
); );
} }
export const getStaticProps = getTranslatedStaticProps(["auth", "login"]);
frontend/pages/password-reset.tsx
+39 -36
View File
@@ -1,34 +1,35 @@
import React, { useState } from 'react'; import React, { useState } from "react";
import Image from 'next/image'; import Image from "next/image";
import { useRouter } from 'next/router'; import { useRouter } from "next/router";
import { faCheck, faX } from '@fortawesome/free-solid-svg-icons'; import { faCheck, faX } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import Button from '~/components/basic/buttons/Button'; import Button from "~/components/basic/buttons/Button";
import InputField from '~/components/basic/InputField'; import InputField from "~/components/basic/InputField";
import passwordCheck from '~/components/utilities/checks/PasswordCheck'; import passwordCheck from "~/components/utilities/checks/PasswordCheck";
import Aes256Gcm from '~/components/utilities/cryptography/aes-256-gcm'; import Aes256Gcm from "~/components/utilities/cryptography/aes-256-gcm";
import EmailVerifyOnPasswordReset from './api/auth/EmailVerifyOnPasswordReset'; import EmailVerifyOnPasswordReset from "./api/auth/EmailVerifyOnPasswordReset";
import getBackupEncryptedPrivateKey from './api/auth/getBackupEncryptedPrivateKey'; import getBackupEncryptedPrivateKey from "./api/auth/getBackupEncryptedPrivateKey";
import resetPasswordOnAccountRecovery from './api/auth/resetPasswordOnAccountRecovery'; import resetPasswordOnAccountRecovery from "./api/auth/resetPasswordOnAccountRecovery";
import { getTranslatedStaticProps } from "~/components/utilities/withTranslateProps";
const queryString = require('query-string'); const queryString = require("query-string");
const nacl = require('tweetnacl'); const nacl = require("tweetnacl");
const jsrp = require('jsrp'); const jsrp = require("jsrp");
nacl.util = require('tweetnacl-util'); nacl.util = require("tweetnacl-util");
const client = new jsrp.client(); const client = new jsrp.client();
export default function PasswordReset() { export default function PasswordReset() {
const router = useRouter(); const router = useRouter();
const parsedUrl = queryString.parse(router.asPath.split('?')[1]); const parsedUrl = queryString.parse(router.asPath.split("?")[1]);
const token = parsedUrl.token; const token = parsedUrl.token;
const email = parsedUrl.to?.replace(' ', '+').trim(); const email = parsedUrl.to?.replace(" ", "+").trim();
const [verificationToken, setVerificationToken] = useState(''); const [verificationToken, setVerificationToken] = useState("");
const [step, setStep] = useState(1); const [step, setStep] = useState(1);
const [backupKey, setBackupKey] = useState(''); const [backupKey, setBackupKey] = useState("");
const [privateKey, setPrivateKey] = useState(''); const [privateKey, setPrivateKey] = useState("");
const [newPassword, setNewPassword] = useState(''); const [newPassword, setNewPassword] = useState("");
const [backupKeyError, setBackupKeyError] = useState(false); const [backupKeyError, setBackupKeyError] = useState(false);
const [passwordErrorLength, setPasswordErrorLength] = useState(false); const [passwordErrorLength, setPasswordErrorLength] = useState(false);
const [passwordErrorNumber, setPasswordErrorNumber] = useState(false); const [passwordErrorNumber, setPasswordErrorNumber] = useState(false);
@@ -43,7 +44,7 @@ export default function PasswordReset() {
ciphertext: result.encryptedPrivateKey, ciphertext: result.encryptedPrivateKey,
iv: result.iv, iv: result.iv,
tag: result.tag, tag: result.tag,
secret: backupKey secret: backupKey,
}) })
); );
setStep(3); setStep(3);
@@ -60,7 +61,7 @@ export default function PasswordReset() {
setPasswordErrorLength, setPasswordErrorLength,
setPasswordErrorNumber, setPasswordErrorNumber,
setPasswordErrorLowerCase, setPasswordErrorLowerCase,
currentErrorCheck: errorCheck currentErrorCheck: errorCheck,
}); });
if (!errorCheck) { if (!errorCheck) {
@@ -72,14 +73,14 @@ export default function PasswordReset() {
.padStart( .padStart(
32 + 32 +
(newPassword.slice(0, 32).length - new Blob([newPassword]).size), (newPassword.slice(0, 32).length - new Blob([newPassword]).size),
'0' "0"
) ),
}) as { ciphertext: string; iv: string; tag: string }; }) as { ciphertext: string; iv: string; tag: string };
client.init( client.init(
{ {
username: email, username: email,
password: newPassword password: newPassword,
}, },
async () => { async () => {
client.createVerifier( client.createVerifier(
@@ -90,12 +91,12 @@ export default function PasswordReset() {
iv, iv,
tag, tag,
salt: result.salt, salt: result.salt,
verifier: result.verifier verifier: result.verifier,
}); });
// if everything works, go the main dashboard page. // if everything works, go the main dashboard page.
if (response?.status === 200) { if (response?.status === 200) {
router.push('/login'); router.push("/login");
} }
} }
); );
@@ -122,14 +123,14 @@ export default function PasswordReset() {
onButtonPressed={async () => { onButtonPressed={async () => {
const response = await EmailVerifyOnPasswordReset({ const response = await EmailVerifyOnPasswordReset({
email, email,
code: token code: token,
}); });
if (response.status == 200) { if (response.status == 200) {
setVerificationToken((await response.json()).token); setVerificationToken((await response.json()).token);
setStep(2); setStep(2);
} else { } else {
console.log('ERROR', response); console.log("ERROR", response);
router.push('/email-not-verified'); router.push("/email-not-verified");
} }
}} }}
size="lg" size="lg"
@@ -195,7 +196,7 @@ export default function PasswordReset() {
setPasswordErrorLength, setPasswordErrorLength,
setPasswordErrorNumber, setPasswordErrorNumber,
setPasswordErrorLowerCase, setPasswordErrorLowerCase,
currentErrorCheck: false currentErrorCheck: false,
}); });
}} }}
type="password" type="password"
@@ -224,7 +225,7 @@ export default function PasswordReset() {
)} )}
<div <div
className={`${ className={`${
passwordErrorLength ? 'text-gray-400' : 'text-gray-600' passwordErrorLength ? "text-gray-400" : "text-gray-600"
} text-sm`} } text-sm`}
> >
14 characters 14 characters
@@ -241,7 +242,7 @@ export default function PasswordReset() {
)} )}
<div <div
className={`${ className={`${
passwordErrorLowerCase ? 'text-gray-400' : 'text-gray-600' passwordErrorLowerCase ? "text-gray-400" : "text-gray-600"
} text-sm`} } text-sm`}
> >
1 lowercase character 1 lowercase character
@@ -258,7 +259,7 @@ export default function PasswordReset() {
)} )}
<div <div
className={`${ className={`${
passwordErrorNumber ? 'text-gray-400' : 'text-gray-600' passwordErrorNumber ? "text-gray-400" : "text-gray-600"
} text-sm`} } text-sm`}
> >
1 number 1 number
@@ -288,3 +289,5 @@ export default function PasswordReset() {
</div> </div>
); );
} }
export const getServerSideProps = getTranslatedStaticProps([]);
frontend/pages/verify-email.tsx
+11 -8
View File
@@ -1,15 +1,16 @@
import React, { useState } from 'react'; import React, { useState } from "react";
import Head from 'next/head'; import Head from "next/head";
import Image from 'next/image'; import Image from "next/image";
import Link from 'next/link'; import Link from "next/link";
import Button from '~/components/basic/buttons/Button'; import Button from "~/components/basic/buttons/Button";
import InputField from '~/components/basic/InputField'; import InputField from "~/components/basic/InputField";
import { getTranslatedStaticProps } from "~/components/utilities/withTranslateProps";
import SendEmailOnPasswordReset from './api/auth/SendEmailOnPasswordReset'; import SendEmailOnPasswordReset from "./api/auth/SendEmailOnPasswordReset";
export default function VerifyEmail() { export default function VerifyEmail() {
const [email, setEmail] = useState(''); const [email, setEmail] = useState("");
const [step, setStep] = useState(1); const [step, setStep] = useState(1);
/** /**
@@ -92,3 +93,5 @@ export default function VerifyEmail() {
</div> </div>
); );
} }
export const getServerSideProps = getTranslatedStaticProps([]);
frontend/public/locales/en/section-token.json
+11 -11
View File
@@ -1,13 +1,13 @@
{ {
"title": "Project Settings", "service-tokens": "Service Tokens",
"description": "These settings only apply to the currently selected Project.", "service-tokens-description": "Every service token is specific to you, a certain project and a certain environment within this project.",
"danger-zone": "Danger Zone", "add-new": "Add New Token",
"delete-project": "Delete Project", "add-dialog": {
"project-to-delete": "Project to be Deleted", "title": "Add a service token for {{target}}",
"danger-zone-note": "As soon as you delete this project, you will not be able to undo it. This will immediately remove all the keys. If you still want to do that, please enter the name of the project below.", "description": "Specify the name, environment, and expiry period. When a token is generated, you will only be able to see it once before it disappears. Make sure to save it somewhere.",
"delete-project-note": "Note: You can only delete a project in case you have more than one", "name": "Service Token Name",
"project-id-description": "To integrate Infisical into your code base and get automatic injection of environmental variables, you should use the following Project ID.", "add": "Add Service Token",
"project-id-description2": "For more guidance, including code snipets for various languages and frameworks, see ", "copy-service-token": "Copy your service token",
"auto-generated": "This is your project's auto-generated unique identifier. It can't be changed.", "copy-service-token-description": "Once you close this popup, you will never see your service token again"
"docs": "Infisical Docs" }
} }