Skip to content

Commit

Permalink
translate(frontend): navbar
Browse files Browse the repository at this point in the history
  • Loading branch information
@gangjun06
gangjun06 committed Nov 27, 2022
1 parent 8dfcc1f commit 4bdb48d
Show file tree
Hide file tree
Showing 3 changed files with 181 additions and 116 deletions.
131 changes: 76 additions & 55 deletions frontend/components/basic/layout.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ import { faPlus } from "@fortawesome/free-solid-svg-icons";
import { decryptAssymmetric, encryptAssymmetric } from "../utilities/crypto";
import Button from "./buttons/Button";

import useTranslation from "next-translate/useTranslation";

export default function Layout({ children }) {
const router = useRouter();
const [workspaceList, setWorkspaceList] = useState([]);
Expand All @@ -34,6 +36,8 @@ export default function Layout({ children }) {
const [loading, setLoading] = useState(false);
const [error, setError] = useState(false);

const { t } = useTranslation();

function closeModal() {
setIsOpen(false);
}
Expand All @@ -48,9 +52,7 @@ export default function Layout({ children }) {
setLoading(true);
setTimeout(() => setLoading(false), 1500);
const workspaces = await getWorkspaces();
const currentWorkspaces = workspaces.map(
(workspace) => workspace.name
);
const currentWorkspaces = workspaces.map((workspace) => workspace.name);
if (!currentWorkspaces.includes(workspaceName)) {
const newWorkspace = await createWorkspace(
workspaceName,
Expand Down Expand Up @@ -104,7 +106,7 @@ export default function Layout({ children }) {
setIsOpen(false);
setNewWorkspaceName("");
} else {
setError("A project with this name already exists.");
setError(t("common:error_project-already-exists"));
setLoading(false);
}
}
Expand All @@ -119,29 +121,32 @@ export default function Layout({ children }) {
"/dashboard/" +
workspaceMapping[workspaceSelected] +
"?Development",
title: "Secrets",
title: t("common:nav.menu.secrets"),
emoji: <FontAwesomeIcon icon={faHouse} />,
},
{
href: "/users/" + workspaceMapping[workspaceSelected],
title: "Members",
title: t("common:nav.menu.members"),
emoji: <FontAwesomeIcon icon={faUser} />,
},
{
href: "/integrations/" + workspaceMapping[workspaceSelected],
title: "Integrations",
title: t("common:nav.menu.integrations"),
emoji: <FontAwesomeIcon icon={faLink} />,
},
{
href: "/settings/project/" + workspaceMapping[workspaceSelected],
title: "Project Settings",
title: t("common:nav.menu.project-settings"),
emoji: <FontAwesomeIcon icon={faGear} />,
},
];

useEffect(async () => {
// Put a user in a workspace if they're not in one yet
if (localStorage.getItem("orgData.id") == null || localStorage.getItem("orgData.id") == "") {
if (
localStorage.getItem("orgData.id") == null ||
localStorage.getItem("orgData.id") == ""
) {
const userOrgs = await getOrganizations();
localStorage.setItem("orgData.id", userOrgs[0]._id);
}
Expand All @@ -150,15 +155,21 @@ export default function Layout({ children }) {
orgId: localStorage.getItem("orgData.id"),
});
let userWorkspaces = orgUserProjects;
if (userWorkspaces.length == 0 && (router.asPath != "/noprojects" && !router.asPath.includes("settings"))) {
if (
userWorkspaces.length == 0 &&
router.asPath != "/noprojects" &&
!router.asPath.includes("settings")
) {
router.push("/noprojects");
} else if (router.asPath != "/noprojects") {
const intendedWorkspaceId = router.asPath
.split("/")
[router.asPath.split("/").length - 1].split("?")[0];

// If a user is not a member of a workspace they are trying to access, just push them to one of theirs
if (intendedWorkspaceId != "heroku" && !userWorkspaces
if (
intendedWorkspaceId != "heroku" &&
!userWorkspaces
.map((workspace) => workspace._id)
.includes(intendedWorkspaceId)
) {
Expand Down Expand Up @@ -207,7 +218,10 @@ export default function Layout({ children }) {
workspaceMapping[workspaceSelected] +
"?Development"
);
localStorage.setItem("projectData.id", workspaceMapping[workspaceSelected])
localStorage.setItem(
"projectData.id",
workspaceMapping[workspaceSelected]
);
}
} catch (error) {
console.log(error);
Expand All @@ -224,69 +238,78 @@ export default function Layout({ children }) {
<div className="py-6"></div>
<div className="flex justify-center w-full mt-7 mb-8 bg-bunker-600 w-full h-full flex flex-col items-center px-4">
<div className="text-gray-400 self-start ml-1 mb-1 text-xs font-semibold tracking-wide">
PROJECT
{t("common:nav.menu.project")}
</div>
{workspaceList.length>0
? <Listbox
{workspaceList.length > 0 ? (
<Listbox
selected={workspaceSelected}
onChange={setWorkspaceSelected}
data={workspaceList}
buttonAction={openModal}
text=""
workspaceMapping={workspaceMapping}
/>
: <Button
) : (
<Button
text="Add Project"
onButtonPressed={openModal}
color="mineshaft"
size="md"
icon={faPlus}
/>
}
)}
</div>
<ul>
{workspaceList.length > 0 && menuItems.map(({ href, title, emoji }) => (
<li className="mt-1.5 mx-2" key={title}>
{router.asPath.split("/")[1] ===
href.split("/")[1] &&
(["project", "billing", "org", "personal"].includes(
router.asPath.split("/")[2]
)
? router.asPath.split("/")[2] ===
href.split("/")[2]
: true) ? (
<div
className={`flex p-2 text-white text-sm rounded cursor-pointer bg-mineshaft-50/10`}
>
<div className="bg-primary w-1 rounded-xl mr-1"></div>
<p className="ml-2 mr-4">
{emoji}
</p>
{title}
</div>
) : router.asPath == "/noprojects" ? (
<div
className={`flex p-2 text-white text-sm rounded`}
>
<p className="ml-2 mr-4">
{emoji}
</p>
{title}
</div>
) : (
<Link href={href}>
{workspaceList.length > 0 &&
menuItems.map(({ href, title, emoji }) => (
<li className="mt-1.5 mx-2" key={title}>
{router.asPath.split("/")[1] ===
href.split("/")[1] &&
([
"project",
"billing",
"org",
"personal",
].includes(
router.asPath.split("/")[2]
)
? router.asPath.split(
"/"
)[2] === href.split("/")[2]
: true) ? (
<div
className={`flex p-2 text-white text-sm rounded cursor-pointer bg-mineshaft-50/10`}
>
<div className="bg-primary w-1 rounded-xl mr-1"></div>
<p className="ml-2 mr-4">
{emoji}
</p>
{title}
</div>
) : router.asPath ==
"/noprojects" ? (
<div
className={`flex p-2 text-white text-sm rounded cursor-pointer hover:bg-mineshaft-50/5`}
className={`flex p-2 text-white text-sm rounded`}
>
<p className="ml-2 mr-4">
{emoji}
</p>
{title}
</div>
</Link>
)}
</li>
))}
) : (
<Link href={href}>
<div
className={`flex p-2 text-white text-sm rounded cursor-pointer hover:bg-mineshaft-50/5`}
>
<p className="ml-2 mr-4">
{emoji}
</p>
{title}
</div>
</Link>
)}
</li>
))}
</ul>
</nav>
</aside>
Expand All @@ -308,9 +331,7 @@ export default function Layout({ children }) {
className="text-gray-300 text-7xl mb-8"
/>
<p className="text-gray-200 px-6 text-center text-lg max-w-sm">
{" "}
To use Infisical, please log in through a device with larger
dimensions.{" "}
{` ${t("common:need-login")} `}
</p>
</div>
</>
Expand Down
Loading

0 comments on commit 4bdb48d

Please sign in to comment.