From ce8649733f7135f9152a787d42b2b299ddd2c27e Mon Sep 17 00:00:00 2001 From: Laux Dev <2201104208@student.buksu.edu.ph> Date: Fri, 27 Feb 2026 16:07:26 +0800 Subject: [PATCH] converted to components --- frontend/src/app/components/icons/agent.jsx | 45 +++++ .../src/app/components/icons/credentials.jsx | 24 +++ frontend/src/app/components/icons/delete.jsx | 47 +++++ frontend/src/app/components/icons/home.jsx | 38 ++++ .../src/app/components/icons/organization.jsx | 24 +++ frontend/src/app/components/icons/project.jsx | 24 +++ frontend/src/app/components/icons/roles.jsx | 53 +++++ frontend/src/app/components/icons/user.jsx | 24 +++ frontend/src/app/components/icons/view.jsx | 29 +++ .../src/app/components/sidebar/Sidebar.jsx | 183 ++---------------- frontend/src/app/credentials/page.jsx | 40 +--- frontend/src/app/organization/page.jsx | 41 +--- frontend/src/app/projects/page.jsx | 62 +----- frontend/src/app/roles/page.jsx | 67 +------ frontend/src/app/users/page.jsx | 67 +------ 15 files changed, 338 insertions(+), 430 deletions(-) create mode 100644 frontend/src/app/components/icons/agent.jsx create mode 100644 frontend/src/app/components/icons/credentials.jsx create mode 100644 frontend/src/app/components/icons/delete.jsx create mode 100644 frontend/src/app/components/icons/home.jsx create mode 100644 frontend/src/app/components/icons/organization.jsx create mode 100644 frontend/src/app/components/icons/project.jsx create mode 100644 frontend/src/app/components/icons/roles.jsx create mode 100644 frontend/src/app/components/icons/user.jsx create mode 100644 frontend/src/app/components/icons/view.jsx diff --git a/frontend/src/app/components/icons/agent.jsx b/frontend/src/app/components/icons/agent.jsx new file mode 100644 index 0000000..739a038 --- /dev/null +++ b/frontend/src/app/components/icons/agent.jsx @@ -0,0 +1,45 @@ +import React from "react"; + +const AgentIcon = (props) => { + return ( + + + + + + + + + + + + ); +}; + +export default AgentIcon; diff --git a/frontend/src/app/components/icons/credentials.jsx b/frontend/src/app/components/icons/credentials.jsx new file mode 100644 index 0000000..07ec861 --- /dev/null +++ b/frontend/src/app/components/icons/credentials.jsx @@ -0,0 +1,24 @@ +import React from "react"; + +const CredentialsIcon = (props) => { + return ( + + + + ); +}; + +export default CredentialsIcon; diff --git a/frontend/src/app/components/icons/delete.jsx b/frontend/src/app/components/icons/delete.jsx new file mode 100644 index 0000000..8559c5c --- /dev/null +++ b/frontend/src/app/components/icons/delete.jsx @@ -0,0 +1,47 @@ +import React from "react"; + +const DeleteIcon = (props) => { + return ( + + + + + + + + ); +}; + +export default DeleteIcon; diff --git a/frontend/src/app/components/icons/home.jsx b/frontend/src/app/components/icons/home.jsx new file mode 100644 index 0000000..8fed4c8 --- /dev/null +++ b/frontend/src/app/components/icons/home.jsx @@ -0,0 +1,38 @@ +import React from "react"; + +const HomeIcon = (props) => { + return ( + + + + + + ); +}; + +export default HomeIcon; diff --git a/frontend/src/app/components/icons/organization.jsx b/frontend/src/app/components/icons/organization.jsx new file mode 100644 index 0000000..6555142 --- /dev/null +++ b/frontend/src/app/components/icons/organization.jsx @@ -0,0 +1,24 @@ +import React from "react"; + +const OrganizationIcon = (props) => { + return ( + + + + ); +}; + +export default OrganizationIcon; diff --git a/frontend/src/app/components/icons/project.jsx b/frontend/src/app/components/icons/project.jsx new file mode 100644 index 0000000..9bf1918 --- /dev/null +++ b/frontend/src/app/components/icons/project.jsx @@ -0,0 +1,24 @@ +import React from "react"; + +const ProjectIcon = (props) => { + return ( + + + + ); +}; + +export default ProjectIcon; diff --git a/frontend/src/app/components/icons/roles.jsx b/frontend/src/app/components/icons/roles.jsx new file mode 100644 index 0000000..244b6fe --- /dev/null +++ b/frontend/src/app/components/icons/roles.jsx @@ -0,0 +1,53 @@ +import React from "react"; + +const RolesIcon = (props) => { + return ( + + + + + + + + + + + + + ); +}; + +export default RolesIcon; diff --git a/frontend/src/app/components/icons/user.jsx b/frontend/src/app/components/icons/user.jsx new file mode 100644 index 0000000..f00b414 --- /dev/null +++ b/frontend/src/app/components/icons/user.jsx @@ -0,0 +1,24 @@ +import React from "react"; + +const UserIcon = (props) => { + return ( + + + + ); +}; + +export default UserIcon; diff --git a/frontend/src/app/components/icons/view.jsx b/frontend/src/app/components/icons/view.jsx new file mode 100644 index 0000000..fe3092c --- /dev/null +++ b/frontend/src/app/components/icons/view.jsx @@ -0,0 +1,29 @@ +import React from "react"; + +const ViewIcon = (props) => { + return ( + + + + + ); +}; + +export default ViewIcon; diff --git a/frontend/src/app/components/sidebar/Sidebar.jsx b/frontend/src/app/components/sidebar/Sidebar.jsx index 8dfad43..26f30a8 100644 --- a/frontend/src/app/components/sidebar/Sidebar.jsx +++ b/frontend/src/app/components/sidebar/Sidebar.jsx @@ -3,6 +3,13 @@ import React from "react"; import styles from "./styles.module.css"; import { usePathname, useRouter } from "next/navigation"; +import HomeIcon from "../icons/home"; +import OrganizationIcon from "../icons/organization"; +import ProjectIcon from "../icons/project"; +import UserIcon from "../icons/user"; +import RolesIcon from "../icons/roles"; +import CredentialsIcon from "../icons/credentials"; +import AgentIcon from "../icons/agent"; const Sidebar = () => { const router = useRouter(); @@ -94,211 +101,49 @@ const Sidebar = () => { className={`${styles.nav} ${pathname.includes("/home") ? styles.active : ""}`} onClick={navToHome} > - - - - - +

Home

- - - +

Organization

- - - +

Project

- - - +

Users

- - - - - - - - - - - - +

Roles

- - - +

Credentials

- - - - - - - - - - - +

Agents

diff --git a/frontend/src/app/credentials/page.jsx b/frontend/src/app/credentials/page.jsx index 05954be..ed9e0de 100644 --- a/frontend/src/app/credentials/page.jsx +++ b/frontend/src/app/credentials/page.jsx @@ -2,6 +2,7 @@ import React from "react"; import TopHeader from "../components/topHeader/TopHeader"; import globalStyle from "../globalStyle.module.css"; import styles from "./styles.module.css"; +import DeleteIcon from "../components/icons/delete"; const CredentialsPage = () => { const sampleData = [ { @@ -77,44 +78,7 @@ const CredentialsPage = () => {
diff --git a/frontend/src/app/organization/page.jsx b/frontend/src/app/organization/page.jsx index 09451cb..b5e3367 100644 --- a/frontend/src/app/organization/page.jsx +++ b/frontend/src/app/organization/page.jsx @@ -4,6 +4,7 @@ import styles from "./styles.module.css"; import TopHeader from "../components/topHeader/TopHeader"; import globalStyle from "../globalStyle.module.css"; import SuccessToast from "../components/toast/success/successToast"; +import DeleteIcon from "../components/icons/delete"; const OrganizationPage = () => { const sampleData = [ @@ -55,7 +56,6 @@ const OrganizationPage = () => { return (
-
@@ -78,44 +78,7 @@ const OrganizationPage = () => {
diff --git a/frontend/src/app/projects/page.jsx b/frontend/src/app/projects/page.jsx index 192feac..79484d3 100644 --- a/frontend/src/app/projects/page.jsx +++ b/frontend/src/app/projects/page.jsx @@ -5,6 +5,8 @@ import globalStyle from "../globalStyle.module.css"; import styles from "./styles.module.css"; import { useRouter } from "next/navigation"; import SuccessToast from "../components/toast/success/successToast"; +import DeleteIcon from "../components/icons/delete"; +import ViewIcon from "../components/icons/view"; const ProjectsPage = () => { const router = useRouter(); const sampleData = [ @@ -219,68 +221,12 @@ const ProjectsPage = () => {
diff --git a/frontend/src/app/roles/page.jsx b/frontend/src/app/roles/page.jsx index 0f58e61..e9c7c29 100644 --- a/frontend/src/app/roles/page.jsx +++ b/frontend/src/app/roles/page.jsx @@ -5,6 +5,8 @@ import TopHeader from "../components/topHeader/TopHeader"; import globalStyle from "../globalStyle.module.css"; import styles from "./styles.module.css"; import { useRouter } from "next/navigation"; +import ViewIcon from "../components/icons/view"; +import DeleteIcon from "../components/icons/delete"; const RolesPage = () => { const router = useRouter(); @@ -71,71 +73,10 @@ const RolesPage = () => {
diff --git a/frontend/src/app/users/page.jsx b/frontend/src/app/users/page.jsx index 127657a..39762b9 100644 --- a/frontend/src/app/users/page.jsx +++ b/frontend/src/app/users/page.jsx @@ -4,6 +4,8 @@ import TopHeader from "../components/topHeader/TopHeader"; import globalStyle from "../globalStyle.module.css"; import styles from "./styles.module.css"; import { useRouter } from "next/navigation"; +import ViewIcon from "../components/icons/view"; +import DeleteIcon from "../components/icons/delete"; const UsersPage = () => { const router = useRouter(); @@ -57,71 +59,10 @@ const UsersPage = () => {