diff --git a/frontend/components/basic/dialog/AddProjectMemberDialog.js b/frontend/components/basic/dialog/AddProjectMemberDialog.js index 60712e21c..67369e93a 100644 --- a/frontend/components/basic/dialog/AddProjectMemberDialog.js +++ b/frontend/components/basic/dialog/AddProjectMemberDialog.js @@ -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, @@ -14,6 +16,7 @@ const AddProjectMemberDialog = ({ setEmail, }) => { const router = useRouter(); + const { t } = useTranslation(); return (
@@ -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" + )} ) : ( - All the users in your organization - are already invited. + {t( + "settings:add-member-dialog.already-all-invited" + )} )}
{data?.length > 0 ? (

- The user will receive an email - with the instructions. + {t( + "settings:add-member-dialog.user-will-email" + )}

- - + + router.push( + "/settings/org/" + + router + .query + .id + ) + } + />, + , + ]} + />
) : (

- Add more users to the - organization first. + {t( + "settings:add-member-dialog.add-user-org-first" + )}

)}
@@ -117,9 +132,13 @@ const AddProjectMemberDialog = ({ {data?.length > 0 ? (
@@ -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" /> )} diff --git a/frontend/i18n.js b/frontend/i18n.js index a0e18ebd5..901b5317b 100644 --- a/frontend/i18n.js +++ b/frontend/i18n.js @@ -9,6 +9,8 @@ module.exports = { pages: { "*": ["common", "nav"], "rgx:^/(login|signup)": ["auth"], + "rgx:^/settings": ["settings"], "/dashboard/[id]": ["dashboard"], + "/users/[id]": ["settings"], }, }; diff --git a/frontend/locales/en-US.json b/frontend/locales/en-US.json index 038291c6c..0a12ad388 100644 --- a/frontend/locales/en-US.json +++ b/frontend/locales/en-US.json @@ -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": { @@ -75,6 +79,12 @@ "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", @@ -82,6 +92,44 @@ "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,<1>click here", + "add-user-to-org": "Add Users to Organization", + "add-member": "Add Member" + } } } diff --git a/frontend/pages/dashboard/[id].js b/frontend/pages/dashboard/[id].js index c960020a3..14cde6a2c 100644 --- a/frontend/pages/dashboard/[id].js +++ b/frontend/pages/dashboard/[id].js @@ -376,29 +376,32 @@ export default function Dashboard() { return data ? (
- Secrets + {t("dashboard:meta.title")}
- + {checkDocsPopUpVisible && ( )} @@ -456,13 +459,13 @@ export default function Dashboard() { className={`flex justify-start max-w-sm mt-2`} >
)} diff --git a/frontend/pages/settings/org/[id].js b/frontend/pages/settings/org/[id].js index 9bbf0046d..fddc2edf2 100644 --- a/frontend/pages/settings/org/[id].js +++ b/frontend/pages/settings/org/[id].js @@ -2,7 +2,11 @@ import React, { useState, useEffect } from "react"; import { useRouter } from "next/router"; import Head from "next/head"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faMagnifyingGlass, faPlus, faX } from "@fortawesome/free-solid-svg-icons"; +import { + faMagnifyingGlass, + faPlus, + faX, +} from "@fortawesome/free-solid-svg-icons"; import { faCheck } from "@fortawesome/free-solid-svg-icons"; import InputField from "../../../components/basic/InputField"; import getWorkspaces from "../../api/workspace/getWorkspaces"; @@ -22,6 +26,7 @@ import getOrganizationSubscriptions from "../../api/organization/GetOrgSubscript import NavHeader from "../../../components/navigation/NavHeader"; import Button from "../../../components/basic/buttons/Button"; +import useTranslation from "next-translate/useTranslation"; export default function SettingsOrg() { const [buttonReady, setButtonReady] = useState(false); @@ -45,18 +50,20 @@ export default function SettingsOrg() { const [email, setEmail] = useState(""); const [currentPlan, setCurrentPlan] = useState(""); + const { t } = useTranslation(); + useEffect(async () => { let org = await getOrganization({ orgId: localStorage.getItem("orgData.id"), }); let orgData = org; setOrgName(orgData.name); - let incidentContactsData = await getIncidentContacts(localStorage.getItem("orgData.id")); + let incidentContactsData = await getIncidentContacts( + localStorage.getItem("orgData.id") + ); setIncidentContacts( - incidentContactsData?.map( - (contact) => contact.email - ) + incidentContactsData?.map((contact) => contact.email) ); const user = await getUser(); @@ -82,8 +89,10 @@ export default function SettingsOrg() { publicKey: user.user?.publicKey, })) ); - const subscriptions = await getOrganizationSubscriptions({orgId: localStorage.getItem("orgData.id")}); - setCurrentPlan(subscriptions.data[0].plan.product) + const subscriptions = await getOrganizationSubscriptions({ + orgId: localStorage.getItem("orgData.id"), + }); + setCurrentPlan(subscriptions.data[0].plan.product); }, []); const modifyOrgName = (newName) => { @@ -127,7 +136,10 @@ export default function SettingsOrg() { setIncidentContacts( incidentContacts.filter((contact) => contact != incidentContact) ); - deleteIncidentContact(localStorage.getItem("orgData.id"), incidentContact); + deleteIncidentContact( + localStorage.getItem("orgData.id"), + incidentContact + ); }; /** @@ -155,12 +167,12 @@ export default function SettingsOrg() { return (
- Settings + {t("settings:meta.org.head-title")}
- +

- Organization Settings + {t("settings:meta.org.title")}

- View and manage your organization here. + {t("settings:meta.org.description")}

@@ -184,7 +196,7 @@ export default function SettingsOrg() {

- Display Name + {t("common:display-name")}

@@ -215,11 +229,10 @@ export default function SettingsOrg() {

- Organization Members + {t("settings:org-members")}

- Manage members of your organization. These users - could afterwards be formed into projects. + {t("settings:org-members-description")}

setSearchUsers(e.target.value) } - placeholder={"Search members..."} + placeholder={t( + "settings:search-members" + )} />
{incidentContacts?.filter((email) => @@ -318,7 +336,10 @@ export default function SettingsOrg() { email.includes(searchIncidentContact) ) .map((contact) => ( -
+

{contact}

@@ -339,7 +360,7 @@ export default function SettingsOrg() { ) : (

- No incident contacts found. + {t("settings:no-incident-contacts")}

)} diff --git a/frontend/pages/users/[id].js b/frontend/pages/users/[id].js index bfd2399ed..c6fb744eb 100644 --- a/frontend/pages/users/[id].js +++ b/frontend/pages/users/[id].js @@ -17,6 +17,8 @@ import getOrganizationUsers from "../api/organization/GetOrgUsers"; import NavHeader from "../../components/navigation/NavHeader"; import Button from "../../components/basic/buttons/Button"; +import useTranslation from "next-translate/useTranslation"; + // #TODO: Update all the workspaceIds const crypto = require("crypto"); const { @@ -34,6 +36,8 @@ export default function Users() { const [personalEmail, setPersonalEmail] = useState(""); const [searchUsers, setSearchUsers] = useState(""); + const { t } = useTranslation(); + const router = useRouter(); let workspaceId; @@ -98,15 +102,13 @@ export default function Users() { firstName: user.user?.firstName, lastName: user.user?.lastName, email: - user.user?.email == null - ? user.inviteEmail - : user.user?.email, + user.user?.email == null ? user.inviteEmail : user.user?.email, role: user?.role, status: user?.status, userId: user.user?._id, membershipId: user._id, publicKey: user.user?.publicKey, - })) + })); setUserList(tempUserList); const orgUsers = await getOrganizationUsers({ orgId: localStorage.getItem("orgData.id"), @@ -114,28 +116,33 @@ export default function Users() { setOrgUserList(orgUsers); setEmail( orgUsers - ?.filter((user) => user.status == "accepted") - .map((user) => user.user.email) - .filter( - (email) => - !tempUserList - ?.map((user1) => user1.email) - .includes(email) - )[0] - ) + ?.filter((user) => user.status == "accepted") + .map((user) => user.user.email) + .filter( + (email) => + !tempUserList + ?.map((user1) => user1.email) + .includes(email) + )[0] + ); }, []); return userList ? (
- Users + {t("settings:meta.members.head-title")} - +
-

Project Members

+

+ {t("settings:meta.members.title")} +

- This pages shows the members of the selected project. + {t("settings:meta.members.description")}

setSearchUsers(e.target.value)} - placeholder={"Search members..."} + placeholder={t("settings:search-members")} />