diff --git a/app/Http/Controllers/UserController.php b/app/Http/Controllers/UserController.php
index dfb2c2a..3978b39 100644
--- a/app/Http/Controllers/UserController.php
+++ b/app/Http/Controllers/UserController.php
@@ -9,6 +9,7 @@
 use App\Models\Company;
 use App\Models\Department;
 use Illuminate\Http\Request;
+use Illuminate\Support\Facades\DB;
 
 class UserController extends Controller
 {
@@ -146,6 +147,10 @@ public function create()
                 ->join('schools', 'departments.school_id', '=', 'schools.id')
                 ->where('schools.id', $schoolId)
                 ->get();
+            $modelIds = DB::table('model_has_roles')
+                ->where('role_id', 6)
+                ->pluck('model_id');
+            $students = User::whereIn('id', $modelIds)->get();
         } elseif ($isKaprog) {
             $roles = Role::where('name', 'student')->orWhere('name', 'kepala program')->orWhere('name', 'mentor')->pluck('name', 'id');
             $schoolId = auth()->user()->schools()->first()->id;
@@ -154,6 +159,10 @@ public function create()
             $departments = Department::where('id', $departmentId)->pluck('name', 'id');
             $courses = Course::where('department_id', $departmentId)->pluck('name', 'id');
             $companies = Company::where('department_id', $departmentId)->get();
+            $modelIds = DB::table('model_has_roles')
+                ->where('role_id', 6)
+                ->pluck('model_id');
+            $students = User::whereIn('id', $modelIds)->get();
         } else {
             $roles = auth()->user()->hasRole('super-admin')
                 ? Role::pluck('name', 'id')
@@ -163,9 +172,13 @@ public function create()
             $departments = Department::pluck('name', 'id');
             $courses = Course::pluck('name', 'id');
             $companies = Company::all();
+            $modelIds = DB::table('model_has_roles')
+                ->where('role_id', 6)
+                ->pluck('model_id');
+            $students = User::whereIn('id', $modelIds)->get();
         }
 
-        return view('users.create', compact('schools', 'departments', 'courses', 'roles', 'companies'));
+        return view('users.create', compact('schools', 'departments', 'courses', 'roles', 'companies', 'students'));
     }
 
     /**
@@ -184,7 +197,8 @@ public function store(Request $request)
             'school_id' => 'nullable|exists:schools,id',
             'department_id' => 'nullable|exists:departments,id',
             'course_id' => 'nullable|exists:courses,id',
-            'company_id' => 'nullable|exists:companies,id'
+            'company_id' => 'nullable|exists:companies,id',
+            'student_ids' => 'nullable|array'
         ]);
 
         try {
@@ -210,6 +224,14 @@ public function store(Request $request)
             if ($request->company_id) {
                 $user->companies()->attach($request->company_id);
             }
+            if ($request->student_ids) {
+                foreach ($request->student_ids as $studentId) {
+                    DB::table('group_user')->insert([
+                        'teacher_id' => $user->id,
+                        'user_id' => $studentId,
+                    ]);
+                }
+            }
 
             return redirect()->route('users.index')
                 ->with('success', 'Berhasil menambahkan user baru');
diff --git a/package-lock.json b/package-lock.json
index d1dc93e..eec3549 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,5 +1,5 @@
 {
-    "name": "Internity-Web",
+    "name": "Internity",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
@@ -13,6 +13,7 @@
                 "font-awesome": "^4.7.0",
                 "iconify-icon": "^1.0.8",
                 "jquery": "^3.7.1",
+                "select2": "^4.1.0-rc.0",
                 "sweetalert": "^2.1.2",
                 "trix": "^2.0.7",
                 "vanilla-picker": "^2.12.2"
@@ -431,12 +432,12 @@
             "dev": true
         },
         "node_modules/axios": {
-            "version": "1.5.1",
-            "resolved": "https://registry.npmjs.org/axios/-/axios-1.5.1.tgz",
-            "integrity": "sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==",
+            "version": "1.7.3",
+            "resolved": "https://registry.npmjs.org/axios/-/axios-1.7.3.tgz",
+            "integrity": "sha512-Ar7ND9pU99eJ9GpoGQKhKf58GpUOgnzuaB7ueNQ5BMi0p+LZ5oaEnfF999fAArcTIBwXTCHAmGcHOZJaWPq9Nw==",
             "dev": true,
             "dependencies": {
-                "follow-redirects": "^1.15.0",
+                "follow-redirects": "^1.15.6",
                 "form-data": "^4.0.0",
                 "proxy-from-env": "^1.1.0"
             }
@@ -484,12 +485,12 @@
             ]
         },
         "node_modules/braces": {
-            "version": "3.0.2",
-            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
-            "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
+            "version": "3.0.3",
+            "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+            "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
             "dev": true,
             "dependencies": {
-                "fill-range": "^7.0.1"
+                "fill-range": "^7.1.1"
             },
             "engines": {
                 "node": ">=8"
@@ -597,9 +598,9 @@
             }
         },
         "node_modules/fill-range": {
-            "version": "7.0.1",
-            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
-            "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
+            "version": "7.1.1",
+            "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+            "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
             "dev": true,
             "dependencies": {
                 "to-regex-range": "^5.0.1"
@@ -609,9 +610,9 @@
             }
         },
         "node_modules/follow-redirects": {
-            "version": "1.15.2",
-            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.2.tgz",
-            "integrity": "sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==",
+            "version": "1.15.6",
+            "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+            "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
             "dev": true,
             "funding": [
                 {
@@ -912,6 +913,11 @@
                 "node": ">=14.0.0"
             }
         },
+        "node_modules/select2": {
+            "version": "4.1.0-rc.0",
+            "resolved": "https://registry.npmjs.org/select2/-/select2-4.1.0-rc.0.tgz",
+            "integrity": "sha512-Hr9TdhyHCZUtwznEH2CBf7967mEM0idtJ5nMtjvk3Up5tPukOLXbHUNmh10oRfeNIhj+3GD3niu+g6sVK+gK0A=="
+        },
         "node_modules/source-map-js": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
@@ -943,9 +949,9 @@
             }
         },
         "node_modules/trix": {
-            "version": "2.0.7",
-            "resolved": "https://registry.npmjs.org/trix/-/trix-2.0.7.tgz",
-            "integrity": "sha512-qnqElm1BA4XYMgwowEHlF4xE4wfEjFBpmybvdzVUQP4OTzQxRXVEQNP4WSvWT6HzV4wYFP06/HSo14fWoGo6jQ=="
+            "version": "2.1.5",
+            "resolved": "https://registry.npmjs.org/trix/-/trix-2.1.5.tgz",
+            "integrity": "sha512-5pC4olCp7BwxTC8Joy1Kv33kDvSOApi9Tqf6c8wygqCgeCx9xPP5cxkZEhvKpMV+kjd9gszingd5fZo834+ktw=="
         },
         "node_modules/vanilla-picker": {
             "version": "2.12.2",
@@ -956,9 +962,9 @@
             }
         },
         "node_modules/vite": {
-            "version": "4.4.11",
-            "resolved": "https://registry.npmjs.org/vite/-/vite-4.4.11.tgz",
-            "integrity": "sha512-ksNZJlkcU9b0lBwAGZGGaZHCMqHsc8OpgtoYhsQ4/I2v5cnpmmmqe5pM4nv/4Hn6G/2GhTdj0DhZh2e+Er1q5A==",
+            "version": "4.5.3",
+            "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.3.tgz",
+            "integrity": "sha512-kQL23kMeX92v3ph7IauVkXkikdDRsYMGTVl5KY2E9OY4ONLvkHf04MDTbnfo6NKxZiDLWzVpP5oTa8hQD8U3dg==",
             "dev": true,
             "dependencies": {
                 "esbuild": "^0.18.10",
diff --git a/package.json b/package.json
index 4ed0977..4759eec 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
         "font-awesome": "^4.7.0",
         "iconify-icon": "^1.0.8",
         "jquery": "^3.7.1",
+        "select2": "^4.1.0-rc.0",
         "sweetalert": "^2.1.2",
         "trix": "^2.0.7",
         "vanilla-picker": "^2.12.2"
diff --git a/resources/js/app.js b/resources/js/app.js
index 3103e5d..575eb2d 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -1 +1 @@
-import "./bootstrap";
+import "./bootstrap";
\ No newline at end of file
diff --git a/resources/js/bootstrap.js b/resources/js/bootstrap.js
index d363730..8fe0fe9 100644
--- a/resources/js/bootstrap.js
+++ b/resources/js/bootstrap.js
@@ -20,8 +20,8 @@ window.swal = swal;
 import utils from "./utils";
 window.utils = utils;
 
-import $ from "jquery";
-window.$ = $;
+// import $ from "jquery";
+// window.$ = $;
 
 import "iconify-icon";
 
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index d64960c..d996220 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <meta name="csrf_token" content="{{ csrf_token() }}" />
     <link rel="icon" type="image/svg+xml" href={{ asset('/img/favicon.ico') }} />
+    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
     <style>
         .notification-dot {
             height: 10px;
@@ -26,6 +27,9 @@
     <div class="content">
         @yield('content')
     </div>
+    <script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
+    
     @stack('scripts')
 </body>
 
diff --git a/resources/views/users/create.blade.php b/resources/views/users/create.blade.php
index e3c99aa..1a3a6fa 100644
--- a/resources/views/users/create.blade.php
+++ b/resources/views/users/create.blade.php
@@ -8,7 +8,7 @@
             <x-form.input-password label="Password *" id="input-password" name="password" />
             <x-form.input-password label="Ulangi Password *" id="input-confirm-password" name="confirm-password" />
             <div class="form-group">
-                <label class="form-label">Role</label>
+                <label class="form-label">Role *</label>
                 <select class="form-select" name="role_id" id="input-role">
                     <option selected hidden value="">Pilih</option>
                     @foreach ($roles as $key => $value)
@@ -20,7 +20,7 @@
             <input type="hidden" value="1" name="school_id">
 
             <div id="department-wrapper" class="d-none">
-                <x-form.select label="Kompetensi Keahlian" id="input-department" name="department_id">
+                <x-form.select label="Kompetensi Keahlian *" id="input-department" name="department_id">
                     <option selected hidden>Pilih</option>
                     <x-slot:options>
                         @foreach ($departments as $key => $value)
@@ -31,7 +31,7 @@
             </div>
 
             <div id="course-wrapper" class="d-none">
-                <x-form.select label="Kelas" id="input-courses" name="course_id">
+                <x-form.select label="Kelas *" id="input-courses" name="course_id">
                     <option selected hidden>Pilih</option>
                     <x-slot:options>
                         @foreach ($courses as $key => $value)
@@ -42,7 +42,7 @@
             </div>
 
             <div id="company-wrapper" class="d-none">
-                <x-form.select label="IDUKA" id="input-companies" name="company_id">
+                <x-form.select label="IDUKA *" id="input-companies" name="company_id">
                     <option selected hidden>Pilih</option>
                     <x-slot:options>
                         @foreach ($companies as $company)
@@ -51,17 +51,28 @@
                     </x-slot:options>
                 </x-form.select>
             </div>
+
+            <div id="student-wrapper" class="form-group d-none">
+                <label class="form-label">Siswa Bimbingan *</label>
+                
+                <select class="form-select" style="width: 100%" name="student_ids[]" id="input-student" multiple="multiple">
+                    @foreach ($students as $student)
+                        <option value="{{ $student->id }}">{{ $student->name }} - {{ $student->courses()->first()?->name }}</option>
+                    @endforeach
+                </select>
+            </div>
         </x-slot:formBody>
     </x-form.form>
 @endsection
 
 @push('scripts')
-    <script>
+    <script type="module">
     document.addEventListener('DOMContentLoaded', function() {
         const roleSelect = document.getElementById('input-role');
         const departmentWrapper = document.getElementById('department-wrapper');
         const courseWrapper = document.getElementById('course-wrapper');
         const companyWrapper = document.getElementById('company-wrapper');
+        const studentWrapper = document.getElementById('student-wrapper');
 
         if (roleSelect && departmentWrapper) {
             roleSelect.addEventListener('change', function() {
@@ -71,23 +82,36 @@
                     departmentWrapper.classList.remove('d-none');
                     courseWrapper.classList.add('d-none');
                     companyWrapper.classList.add('d-none');
+                    studentWrapper.classList.add('d-none');
                 } else if (selectedRole === 'mentor') {
                     departmentWrapper.classList.add('d-none');
                     companyWrapper.classList.remove('d-none');
                     courseWrapper.classList.add('d-none');
+                    studentWrapper.classList.add('d-none');
                 } else if (selectedRole === 'student') {
                     departmentWrapper.classList.add('d-none');
                     companyWrapper.classList.add('d-none');
                     courseWrapper.classList.remove('d-none');
+                    studentWrapper.classList.add('d-none');
+                } else if (selectedRole === 'teacher') {
+                    departmentWrapper.classList.add('d-none');
+                    companyWrapper.classList.add('d-none');
+                    courseWrapper.classList.add('d-none');
+                    studentWrapper.classList.remove('d-none');
                 } else {
                     departmentWrapper.classList.add('d-none');
                     courseWrapper.classList.add('d-none');
                     companyWrapper.classList.add('d-none');
+                    studentWrapper.classList.add('d-none');
                 }
             });
         } else {
             console.error('Elements not found');
         }
     });
+
+    $(document).ready(function() {
+        $("#input-student").select2();
+    });
     </script>
 @endpush
\ No newline at end of file