Merge pull request #81 from learnhouse/swve/eng-30-new-page-account-creation-from-org

Add org_id to a user when signing up

front/app/_orgs/[orgslug]/login/page.tsx

@@ -2,8 +2,8 @@
 import { useRouter } from 'next/navigation';
 import React, { useState } from "react";
 import { styled } from '@stitches/react';
-import { Title } from "../../components/UI/Elements/Styles/Title";
+import { Title } from "../../../../components/UI/Elements/Styles/Title";
-import { loginAndGetToken } from "../../services/auth/auth";
+import { loginAndGetToken } from "../../../../services/auth/auth";
 import FormLayout, { ButtonBlack, Flex, FormField, FormLabel, FormMessage, Input } from '@components/UI/Form/Form';
 import * as Form from '@radix-ui/react-form';
 import { BarLoader } from 'react-spinners';

front/app/_orgs/[orgslug]/signup/page.tsx

@@ -0,0 +1,118 @@
+"use client";
+import React from "react";
+import { Title } from "../../../../components/UI/Elements/Styles/Title";
+import { signup } from "../../../../services/auth/auth";
+import { useRouter } from "next/navigation";
+
+const SignUp = (params: any) => {
+  const org_slug = params.params.orgslug;
+  const router = useRouter();
+  const [email, setEmail] = React.useState("");
+  const [password, setPassword] = React.useState("");
+  const [username, setUsername] = React.useState("");
+
+  const handleSubmit = (e: any) => {
+    e.preventDefault();
+    console.log({ email, password, username, org_slug });
+    alert(JSON.stringify({ email, password, username, org_slug }));
+    try {
+      signup({ email, password, username, org_slug });
+      router.push("/");
+    }
+    catch (err) {
+      console.log(err);
+    }
+  };
+
+  const handleEmailChange = (e: any) => {
+    setEmail(e.target.value);
+  };
+
+  const handlePasswordChange = (e: any) => {
+    setPassword(e.target.value);
+  };
+
+  const handleUsernameChange = (e: any) => {
+    setUsername(e.target.value);
+  };
+
+  return (
+    <div>
+      <div title="Sign up">
+        <Title>Sign up </Title>
+
+        {/* Create a login ui with tailwindcss */}
+        <div className="flex justify-center items-center h-screen">
+          <div className="w-full max-w-md">
+            <form onSubmit={handleSubmit}>
+              <div className="mb-4 space-y-3">
+                <label className="block text-gray-700 text-sm font-bold mb-2">
+                  Email
+                </label>
+                <input
+                  type="email"
+                  name="email"
+                  value={email}
+                  onChange={handleEmailChange}
+                  className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+                  placeholder="Email"
+                />
+
+                <label className="block text-gray-700 text-sm font-bold mb-2">
+                  Username
+                </label>
+
+                <input
+                  type="text"
+                  name="username"
+                  value={username}
+                  onChange={handleUsernameChange}
+                  className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+                  placeholder="Username"
+                />
+
+                <label className="block text-gray-700 text-sm font-bold mb-2">
+                  Password
+                </label>
+
+                <input
+                  type="password"
+                  name="password"
+                  value={password}
+                  onChange={handlePasswordChange}
+                  className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+                  placeholder="Password"
+                />
+
+                <button
+                  type="submit"
+                  className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
+                >
+                  Sign up
+                </button>
+
+                <a
+                  href="/login"
+                  className="inline-block align-baseline font-bold text-sm text-blue-500 hover:text-blue-800 ml-3"
+                >
+                  Already have an account? Login
+                </a>
+
+                <a
+                  href="/"
+                  className="inline-block align-baseline font-bold text-sm text-blue-500 hover:text-blue-800 ml-3"
+                >
+                  Home
+                </a>
+
+
+              </div>
+            </form>
+
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+export default SignUp;

front/app/signup/page.tsx

@@ -1,47 +0,0 @@
-"use client";
-import React from "react";
-import { Title } from "../../components/UI/Elements/Styles/Title";
-import { signup } from "../../services/auth/auth";
-
-const SignUp = () => {
-  const [email, setEmail] = React.useState("");
-  const [password, setPassword] = React.useState("");
-  const [username, setUsername] = React.useState("");
-
-  const handleSubmit = (e: any) => {
-    e.preventDefault();
-    console.log({ email, password, username });
-    alert(JSON.stringify({ email, password, username }));
-    signup({ email, password, username });
-  };
-
-  const handleEmailChange = (e: any) => {
-    setEmail(e.target.value);
-  };
-
-  const handlePasswordChange = (e: any) => {
-    setPassword(e.target.value);
-  };
-
-  const handleUsernameChange = (e: any) => {
-    setUsername(e.target.value);
-  };
-
-  return (
-    <div>
-      <div title="Sign up">
-        <Title>Sign up </Title>
-
-        <form>
-          <input onChange={handleUsernameChange} type="text" placeholder="username" />
-          <input onChange={handleEmailChange} type="text" placeholder="email" />
-          <input onChange={handlePasswordChange} type="password" placeholder="password" />
-          <button onClick={handleSubmit} type="submit">
-            Sign up
-          </button>
-        </form>
-      </div>
-    </div>
-  );
-};
-export default SignUp;

front/middleware.ts

@@ -11,7 +11,7 @@ export const config = {
      * 4. /examples (inside /public)
      * 5. all root files inside /public (e.g. /favicon.ico)
      */
-    "/((?!api|_next|fonts|login|signup|examples|[\\w-]+\\.\\w+).*)",
+    "/((?!api|_next|fonts|examples|[\\w-]+\\.\\w+).*)",
   ],
 };
 

front/services/auth/auth.ts

@@ -64,6 +64,7 @@ interface NewAccountBody {
   username: string;
   email: string;
   password: string;
+  org_slug: string;
 }
 
 export async function signup(body: NewAccountBody): Promise<any> {
@@ -76,7 +77,7 @@ export async function signup(body: NewAccountBody): Promise<any> {
     redirect: "follow",
   };
 
-  return fetch(`${getAPIUrl()}users/`, requestOptions)
+  return fetch(`${getAPIUrl()}users/?org_slug=${body.org_slug}`, requestOptions)
     .then((result) => result.json())
     .catch((error) => console.log("error", error));
 }

src/routers/users.py

@@ -37,11 +37,11 @@ async def api_get_user_by_userid(request: Request,user_id: str):
 
 
 @router.post("/")
-async def api_create_user(request: Request,user_object: UserWithPassword, org_id: str ):
+async def api_create_user(request: Request,user_object: UserWithPassword, org_slug: str ):
     """
     Create new user
     """
-    return await create_user(request, None, user_object, org_id)
+    return await create_user(request, None, user_object, org_slug)
 
 
 @router.delete("/user_id/{user_id}")

src/services/users/users.py

@@ -7,7 +7,7 @@ from src.security.security import security_hash_password, security_verify_passwo
 from src.services.users.schemas.users import PasswordChangeForm, PublicUser, User, UserOrganization, UserWithPassword, UserInDB
 
 
-async def create_user(request: Request, current_user: PublicUser | None,  user_object: UserWithPassword, org_id: str):
+async def create_user(request: Request, current_user: PublicUser | None,  user_object: UserWithPassword, org_slug: str):
     users = request.app.db["users"]
 
     isUsernameAvailable = await users.find_one({"username": user_object.username})
@@ -34,11 +34,25 @@ async def create_user(request: Request, current_user: PublicUser | None,  user_o
     user_object.username = user_object.username.lower()
     user_object.password = await security_hash_password(user_object.password)
 
+    # Get org_id from org_slug 
+    orgs = request.app.db["organizations"]
+
+    # Check if the org exists
+    isOrgExists = await orgs.find_one({"slug": org_slug})
+
+    # If the org does not exist, raise an error
+    if not isOrgExists:
+        raise HTTPException(
+            status_code=status.HTTP_409_CONFLICT, detail="You are trying to create a user in an organization that does not exist")
+    
+    org_id = isOrgExists["org_id"]
+    
+
     # Create initial orgs list with the org_id passed in
     orgs = [UserOrganization(org_id=org_id, org_role="member")]
 
     # Give role
-    roles = ["role_1"]
+    roles = ["role_member"]
 
     # Create the user
     user = UserInDB(user_id=user_id, creation_date=str(datetime.now()),