feat: add organizations setttings panel

front/app/_orgs/[orgslug]/settings/account/profile/page.tsx

@@ -5,11 +5,8 @@ import { Formik, Form, Field, ErrorMessage } from 'formik';
 import { updateProfile } from '@services/settings/profile';
 
 function SettingsProfilePage() {
-
     const auth: any = React.useContext(AuthContext);
 
-
-
     return (
         <div>
 

front/app/_orgs/[orgslug]/settings/layout.tsx

@@ -27,7 +27,6 @@ function SettingsLayout({ children, params }: { children: React.ReactNode, param
                         <MenuTitle>Organization</MenuTitle>
                         <ul>
                             <li><Link href="/settings/organization/general">General</Link></li>
-                            <li><Link href="/settings/organization/roles">Roles</Link></li>
                         </ul>
                     </LeftMenuWrapper>
                 </LeftWrapper>

front/app/_orgs/[orgslug]/settings/organization/general/page.tsx

@@ -0,0 +1,77 @@
+"use client";
+import React from 'react'
+import useSWR, { mutate } from "swr";
+import { swrFetcher } from "@services/utils/requests";
+import { getAPIUrl } from '@services/config';
+import { Field, Form, Formik } from 'formik';
+import { updateOrganization } from '@services/settings/org';
+
+interface OrganizationValues {
+  name: string;
+  description: string;
+  slug: string;
+  email: string;
+}
+
+function SettingsOrganizationGeneral(params: any) {
+  const orgslug = params.params.orgslug;
+  const { data: org, error: error } = useSWR(`${getAPIUrl()}orgs/slug/${orgslug}`, swrFetcher);
+
+  if (org) {
+    let orgValues: OrganizationValues = {
+      name: org.name,
+      description: org.description,
+      slug: org.slug,
+      email: org.email
+    }
+
+
+    const updateOrg = async (values: OrganizationValues) => {
+      let org_id = org.org_id;
+      await updateOrganization(org_id, values);
+
+      // Sounds good, doesn't work
+      // TODO: Fix this
+      mutate(`${getAPIUrl()}orgs/slug/${values.slug}`);
+    }
+
+    return (
+      <div>
+        <h1>Oganization Settings</h1>
+        <br /><br />
+        {error && <p>Failed to load</p>}
+        {!org ? (
+          <div>Loading...</div>
+        ) : (
+
+          <Formik
+            initialValues={orgValues}
+            onSubmit={(values, { setSubmitting }) => {
+              setTimeout(() => {
+                alert(JSON.stringify(values, null, 2));
+                setSubmitting(false);
+                updateOrg(values)
+              }, 400);
+            }}
+          >
+            {({ isSubmitting }) => (
+              <Form>
+                Name  <Field type="text" name="name" /><br />
+                Description  <Field type="text" name="description" /><br />
+                Slug  <Field disabled type="text" name="slug" /> <br /> 
+                Email  <Field type="email" name="email" /><br />
+                <button type="submit" disabled={isSubmitting}>
+                  Submit
+                </button>
+              </Form>
+            )}
+          </Formik>
+        )}
+
+
+      </div>
+    )
+  }
+}
+
+export default SettingsOrganizationGeneral

front/app/_orgs/[orgslug]/settings/organization/roles/page.tsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+function SettingsOrganizationRole() {
+  return (
+    <div>SettingsOrganizationRole</div>
+  )
+}
+
+export default SettingsOrganizationRole

front/services/settings/org.ts

@@ -0,0 +1,15 @@
+import { getAPIUrl } from "@services/config";
+import { RequestBody } from "@services/utils/requests";
+
+/*
+ This file includes only POST, PUT, DELETE requests
+ GET requests are called from the frontend using SWR (https://swr.vercel.app/)
+*/
+
+export async function updateOrganization(org_id : string, data: any) {
+  const result: any = await fetch(`${getAPIUrl()}orgs/` + org_id, RequestBody("PUT", data))
+    .then((result) => result.json())
+    .catch((error) => console.log("error", error));
+
+  return result;
+}