Skip to content

Commit

Permalink
translate(frontend): some setting page
Browse files Browse the repository at this point in the history
  • Loading branch information
@gangjun06
gangjun06 committed Nov 27, 2022
1 parent 14bffeb commit 2c1398e
Show file tree
Hide file tree
Showing 6 changed files with 197 additions and 95 deletions.
91 changes: 56 additions & 35 deletions frontend/components/basic/dialog/AddProjectMemberDialog.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@ import { Fragment, useState } from "react";
import ListBox from "../Listbox";
import { useRouter } from "next/router";
import Button from "../buttons/Button";
import useTranslation from "next-translate/useTranslation";
import Trans from "next-translate/Trans";

const AddProjectMemberDialog = ({
isOpen,
Expand All @@ -14,6 +16,7 @@ const AddProjectMemberDialog = ({
setEmail,
}) => {
const router = useRouter();
const { t } = useTranslation();

return (
<div className="z-50">
Expand Down Expand Up @@ -48,56 +51,68 @@ const AddProjectMemberDialog = ({
as="h3"
className="text-lg font-medium leading-6 text-gray-400 z-50"
>
Add a member to your project
{t(
"settings:add-member-dialog.add-member-to-project"
)}
</Dialog.Title>
) : (
<Dialog.Title
as="h3"
className="text-lg font-medium leading-6 text-gray-400 z-50"
>
All the users in your organization
are already invited.
{t(
"settings:add-member-dialog.already-all-invited"
)}
</Dialog.Title>
)}
<div className="mt-2 mb-4">
{data?.length > 0 ? (
<div className="flex flex-col">
<p className="text-sm text-gray-500">
The user will receive an email
with the instructions.
{t(
"settings:add-member-dialog.user-will-email"
)}
</p>
<div className="">
<button
type="button"
className="inline-flex justify-center rounded-md py-1 text-sm text-gray-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
onClick={() =>
router.push(
"/settings/org/" +
router.query.id
)
}
>
If you are looking to add users to your org,
</button>
<button
type="button"
className="ml-1 inline-flex justify-center rounded-md py-1 text-sm text-gray-500 hover:text-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
onClick={() =>
router.push(
"/settings/org/" +
router.query.id +
"?invite"
)
}
>
click here.
</button>
<Trans
i18nKey="settings:add-member-dialog.looking-add"
components={[
<button
type="button"
className="inline-flex justify-center rounded-md py-1 text-sm text-gray-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
onClick={() =>
router.push(
"/settings/org/" +
router
.query
.id
)
}
/>,
<button
type="button"
className="ml-1 inline-flex justify-center rounded-md py-1 text-sm text-gray-500 hover:text-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
onClick={() =>
router.push(
"/settings/org/" +
router
.query
.id +
"?invite"
)
}
>
click here.
</button>,
]}
/>
</div>
</div>
) : (
<p className="text-sm text-gray-500">
Add more users to the
organization first.
{t(
"settings:add-member-dialog.add-user-org-first"
)}
</p>
)}
</div>
Expand All @@ -117,9 +132,13 @@ const AddProjectMemberDialog = ({
{data?.length > 0 ? (
<div className="mt-6 flex flex-col justify-start w-max">
<Button
onButtonPressed={submitModal}
onButtonPressed={
submitModal
}
color="mineshaft"
text="Add Member"
text={t(
"settings:add-member-dialog.add-member"
)}
size="md"
/>
</div>
Expand All @@ -132,7 +151,9 @@ const AddProjectMemberDialog = ({
)
}
color="mineshaft"
text="Add Users to Organization"
text={t(
"settings:add-member-dialog.add-user-to-org"
)}
size="md"
/>
)}
Expand Down
2 changes: 2 additions & 0 deletions frontend/i18n.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,8 @@ module.exports = {
pages: {
"*": ["common", "nav"],
"rgx:^/(login|signup)": ["auth"],
"rgx:^/settings": ["settings"],
"/dashboard/[id]": ["dashboard"],
"/users/[id]": ["settings"],
},
};
52 changes: 50 additions & 2 deletions frontend/locales/en-US.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,8 +17,12 @@
"click-to-copy": "Click to copy",
"project-id": "Project ID",
"save-changes": "Save Changes",
"saved": "Saved",
"drop-zone": "Drag and drop your .env file here.",
"drop-zone-keys": "Drag and drop your .env file here to add more keys."
"drop-zone-keys": "Drag and drop your .env file here to add more keys.",
"role": "Role",
"role_admin": "admin",
"display-name": "Display Name"
},
"nav": {
"support": {
Expand Down Expand Up @@ -75,13 +79,57 @@
"step4-download": "Download PDF"
},
"dashboard": {
"secrets": "Secrets",
"meta": {
"title": "Dashboard | Infiscal",
"og-title": "Manage your .env files in seconds",
"og-description": "Infisical a simple end-to-end encrypted platform that enables teams to sync and manage their .env files."
},
"search-keys": "Search keys...",
"add-key": "Add Key",
"personal": "Personal",
"personal-description": "Personal keys are only visible to you",
"shared": "Shared",
"shared-description": "Shared keys are visible to your whole team",
"make-shared": "Make Shared",
"make-personal": "Make Personal"
"make-personal": "Make Personal",
"check-docs": {
"button": "Check Docs",
"title": "Good job!",
"line1": "Congrats on adding more secrets.",
"line2": "Here is how to connect them to your codebase."
}
},
"settings": {
"meta": {
"members": {
"title": "Project Members",
"head-title": "Project Settings | Infiscal",
"description": "This pages shows the members of the selected project."
},
"org": {
"title": "Organization Settings",
"head-title": "Organization Settings | Infiscal",
"description": "Manage members of your organization. These users could afterwards be formed into projects."
}
},
"search-members": "Search members...",
"search": "Search...",
"add-member": "Add Member",
"org-members": "Organization Members",
"org-members-description": "Manage members of your organization. These users could afterwards be formed into projects.",
"incident-contacts": "Incident Contacts",
"incident-contacts-description": "These contacts will be notified in the unlikely event of a severe incident.",
"no-incident-contacts": "No incident contacts found.",
"add-contact": "Add Contact",
"add-member-dialog": {
"add-member-to-project": "Add a member to your project",
"already-all-invited": "All the users in your organization are already invited.",
"add-user-org-first": "Add more users to the organization first.",
"user-will-email": "The user will receive an email with the instructions.",
"looking-add": "<0>If you are looking to add users to your org,</0><1>click here</1>",
"add-user-to-org": "Add Users to Organization",
"add-member": "Add Member"
}
}
}
23 changes: 13 additions & 10 deletions frontend/pages/dashboard/[id].js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -376,29 +376,32 @@ export default function Dashboard() {
return data ? (
<div className="bg-bunker-800 max-h-screen flex flex-col justify-between text-white">
<Head>
<title>Secrets</title>
<title>{t("dashboard:meta.title")}</title>
<link rel="icon" href="/infisical.ico" />
<meta property="og:image" content="/images/message.png" />
<meta
property="og:title"
content="Manage your .env files in seconds"
content={t("dashboard:meta.og-title")}
/>
<meta
name="og:description"
content="Infisical a simple end-to-end encrypted platform that enables teams to sync and manage their .env files."
content={t("dashboard:meta.og-description")}
/>
</Head>
<div className="flex flex-row">
<div className="w-full max-h-96 pb-2">
<NavHeader pageName="Secrets" isProjectRelated={true} />
<NavHeader
pageName={t("dashboard:secrets")}
isProjectRelated={true}
/>
{checkDocsPopUpVisible && (
<BottonRightPopup
buttonText="Check Docs"
buttonText={t("dashboard:check-docs.button")}
buttonLink="https://infisical.com/docs/getting-started/introduction"
titleText="Good job!"
titleText={t("dashboard:check-docs.title")}
emoji="🎉"
textLine1="Congrats on adding more secrets."
textLine2="Here is how to connect them to your codebase."
textLine1={t("dashboard:check-docs.line1")}
textLine2={t("dashboard:check-docs.line2")}
setCheckDocsPopUpVisible={setCheckDocsPopUpVisible}
/>
)}
Expand Down Expand Up @@ -456,13 +459,13 @@ export default function Dashboard() {
className={`flex justify-start max-w-sm mt-2`}
>
<Button
text={t("save-changes")}
text={t("common:save-changes")}
onButtonPressed={savePush}
color="primary"
size="md"
active={buttonReady}
iconDisabled={faCheck}
textDisabled="Saved"
textDisabled={t("common:saved")}
/>
</div>
)}
Expand Down
Loading

0 comments on commit 2c1398e

Please sign in to comment.