Pembelian Saham

# feat:
- Fitur pembelian saham
- Status transaksi
- Table transaksi
- Table nama bank
### No Issue

src/app_modules/auth/login/view.tsx

@@ -5,7 +5,7 @@ import { randomOTP } from "@/app/fun/rondom_otp";
 import { ApiHipmi } from "@/app/lib/api";
 import { Warna } from "@/app/lib/warna";
 import { Button, Center, Flex, Stack, TextInput, Title } from "@mantine/core";
-import { getHotkeyHandler, useHotkeys } from "@mantine/hooks";
+import { getHotkeyHandler, useFocusTrap, useHotkeys } from "@mantine/hooks";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
 import toast from "react-simple-toasts";
@@ -19,6 +19,7 @@ export default function Login() {
   const [nomor, setNomor] = useState("");
   const [inputNumber, setInputNumber] = useAtom(gs_nomor);
   const [code, setCode] = useAtom(gs_otp);
+  const focusTrapRef = useFocusTrap();
 
   const onLogin = async () => {
     const body = {
@@ -67,6 +68,7 @@ export default function Login() {
         <Title>Login</Title>
 
         <TextInput
+        ref={focusTrapRef}
           label="Phone Number"
           w={250}
           type="number"

src/app_modules/auth/register/view.tsx

@@ -11,11 +11,13 @@ import toast from "react-simple-toasts";
 import { ApiHipmi } from "@/app/lib/api";
 import { useRouter } from "next/navigation";
 import _ from "lodash";
+import { useFocusTrap } from "@mantine/hooks";
 
 export default function Register() {
   const route = useRouter();
   const [nomor, setNomor] = useAtom(gs_nomor);
   const [value, setValue] = useState("");
+  const focusTrapRef = useFocusTrap();
 
   const onRegister = async () => {
     myConsole(value);
@@ -61,6 +63,7 @@ export default function Register() {
         <Flex direction={"column"} gap={"xl"} align={"center"}>
           <Flex direction={"column"}>
             <TextInput
+            ref={focusTrapRef}
               w={250}
               label="Username"
               placeholder="Username"

src/app_modules/auth/validasi/view.tsx

@@ -20,6 +20,7 @@ import toast from "react-simple-toasts";
 import { ApiHipmi } from "@/app/lib/api";
 import { useRouter } from "next/navigation";
 import { funGetUserProfile } from "@/app_modules/fun/get_user_profile";
+import { useFocusTrap } from "@mantine/hooks";
 
 export default function Validasi() {
   const router = useRouter();
@@ -27,6 +28,7 @@ export default function Validasi() {
   const [code, setCode] = useAtom(gs_otp);
 
   const [inputCode, setInputOtp] = useState("");
+  const focusTrapRef = useFocusTrap();
 
   const onValid = async () => {
     // MyConsole(inputCode)
@@ -85,6 +87,7 @@ export default function Validasi() {
             <Text>to {nomor}</Text>
           </Flex>
           <PinInput
+          ref={focusTrapRef}
             spacing={"md"}
             mt={"md"}
             onChange={(val) => {