From 39707e9c8304c550e19798d7c9c8008d7caf1b5c Mon Sep 17 00:00:00 2001
From: Femi Novia Lina <77434812+FemiNoviaLina@users.noreply.github.com>
Date: Fri, 13 May 2022 22:04:30 +0700
Subject: [PATCH 1/3] add logic to find vehicles form

---
 app/Http/Controllers/RentController.php       | 25 ++++++++++-
 .../2022_05_13_062551_update_users_table.php  |  8 ++--
 ...4_add_available_unit_to_vehicles_table.php | 32 ++++++++++++++
 database/seeders/UserSeeder.php               | 44 +++++++++++++++++++
 resources/views/find-vehicles.blade.php       | 14 +++---
 resources/views/layouts/guest.blade.php       |  2 +
 resources/views/vehicles-list.blade.php       |  0
 routes/web.php                                | 10 +++--
 8 files changed, 120 insertions(+), 15 deletions(-)
 create mode 100644 database/migrations/2022_05_13_083354_add_available_unit_to_vehicles_table.php
 create mode 100644 database/seeders/UserSeeder.php
 create mode 100644 resources/views/vehicles-list.blade.php

diff --git a/app/Http/Controllers/RentController.php b/app/Http/Controllers/RentController.php
index 97b2525..b8d5888 100644
--- a/app/Http/Controllers/RentController.php
+++ b/app/Http/Controllers/RentController.php
@@ -4,11 +4,32 @@
 
 use Illuminate\Http\Request;
 
+use Illuminate\Support\Facades\DB;
+
+use App\Models\Vehicle;
+
+use App\Models\Order;
+
 class RentController extends Controller
 {
     public function getFindCar()
     {
-        return view('find-vehicles');
+        return view('find-vehicles', ['type' => 'Car']);
+    }
+
+    public function findVehicles() {
+        $request = request()->input();
+        $type = $request['type'];
+
+        $vehicles = Vehicle::join('orders', 'vehicles.id', '=', 'orders.vehicle_id')
+        ->select("vehicles.id", "vehicles.name", "vehicles.brand_id", "vehicles.transmission", "vehicles.cc", "vehicles.price", "vehicles.type", "vehicles.photo", "vehicles.year")
+        ->where("orders.dropoff_date", "<", $request['pickup_date'])
+        ->orWhere("orders.pickup_date", ">", $request['dropoff_date'])
+        ->groupBy("vehicles.id")
+        ->having('vehicles.available_unit', '>', DB::raw('count(orders.id)'))
+        ->get();
+
+        return redirect()->route('rent-'. strtolower($type). 's', ['vehicles' => $vehicles]);
     }
 
     public function getFindMotor()
@@ -28,7 +49,7 @@ public function getRentMotorForm()
 
     public function getRentCars()
     {
-        return view('vehicles-list');
+        return view('vehicles-list', ['vehicles' => session('vehicles'), 'type' => 'Car']);
     }
 
     public function getRentMotors()
diff --git a/database/migrations/2022_05_13_062551_update_users_table.php b/database/migrations/2022_05_13_062551_update_users_table.php
index 2b832a9..406ed16 100644
--- a/database/migrations/2022_05_13_062551_update_users_table.php
+++ b/database/migrations/2022_05_13_062551_update_users_table.php
@@ -14,10 +14,10 @@
     public function up()
     {
         Schema::table('users', function (Blueprint $table) {
-            $table->string('phone_1');
-            $table->string('phone_2');
-            $table->string('address_id');
-            $table->string('address_mlg');
+            $table->string('phone_1')->nullable();
+            $table->string('phone_2')->nullable();
+            $table->string('address_id')->nullable();
+            $table->string('address_mlg')->nullable();
         });
     }
 
diff --git a/database/migrations/2022_05_13_083354_add_available_unit_to_vehicles_table.php b/database/migrations/2022_05_13_083354_add_available_unit_to_vehicles_table.php
new file mode 100644
index 0000000..9f72ee4
--- /dev/null
+++ b/database/migrations/2022_05_13_083354_add_available_unit_to_vehicles_table.php
@@ -0,0 +1,32 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     *
+     * @return void
+     */
+    public function up()
+    {
+        Schema::table('vehicles', function (Blueprint $table) {
+            $table->integer('available_unit')->nullable()->unsigned();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::table('vehicles', function (Blueprint $table) {
+            $table->dropColumn('available_unit');
+        });
+    }
+};
diff --git a/database/seeders/UserSeeder.php b/database/seeders/UserSeeder.php
new file mode 100644
index 0000000..3bdb696
--- /dev/null
+++ b/database/seeders/UserSeeder.php
@@ -0,0 +1,44 @@
+<?php
+
+namespace Database\Seeders;
+
+use Illuminate\Database\Console\Seeds\WithoutModelEvents;
+use Illuminate\Database\Seeder;
+use Illuminate\Support\Facades\Hash;
+
+class UserSeeder extends Seeder
+{
+    /**
+     * Run the database seeds.
+     *
+     * @return void
+     */
+    public function run()
+    {
+        $data = [
+            [ 
+                'name' => 'John Doe' , 
+                'email' => 'johndoe@mail.com',
+                'password' => Hash::make('password'),
+                'role' => 'admin',
+                'email_verified_at' => now()
+            ],
+            [ 
+                'name' => 'Jane Doe' , 
+                'email' => 'janedoe@mail.com',
+                'password' => Hash::make('password'),
+                'role' => 'admin',
+                'email_verified_at' => now()
+            ],
+            [ 
+                'name' => 'John Smith' ,
+                'email' => 'johnsmith@mail.com',
+                'password' => Hash::make('password'),
+                'role' => 'admin',
+                'email_verified_at' => now()
+            ]
+        ];
+
+        \DB::table('users')->insert($data);
+    }
+}
diff --git a/resources/views/find-vehicles.blade.php b/resources/views/find-vehicles.blade.php
index 83ea1c8..88c648b 100644
--- a/resources/views/find-vehicles.blade.php
+++ b/resources/views/find-vehicles.blade.php
@@ -2,18 +2,20 @@
     <x-base-body selected="true">
         <div class="min-h-screen flex flex-col sm:justify-center items-center sm:pt-0 bg-">
             <div class="w-3/6 max-w-4xl mt-6 px-12 py-20 bg-white shadow-md overflow-hidden sm:rounded-lg">
-                <h3 class="font-bold text-center text-3xl text-lilac-100 mt-2">Search for Motorcycle Rent</h3>
-                <form action="" method="post" class="px-20 mt-8">
+                <h3 class="font-bold text-center text-3xl text-lilac-100 mt-2">Search for {{ $type }} Rent</h3>
+                <form action=" {{ '/find/'.$type }}" method="post" class="px-20 mt-8">
+                    @csrf
                     <x-label for="pickup" value="Pick up" class="block font-bold text-base mt-6"/>
                     <div class="date-time flex">
-                        <x-input id="pickup-date" class="block basis-8/12" type="date" name="pickup-time" value="{{ date('Y-m-d') }}" required />
-                        <x-input id="pickup-time" class="block basis-4/12 ml-4" type="time" name="pickup-date" value="{{ explode(' ', gmdate('Y-m-d h:i \G\M\T'))[1] }}" required />
+                        <x-input id="pickup-date" class="block basis-8/12" type="date" name="pickup_date" value="{{ date('Y-m-d') }}" required />
+                        <x-input id="pickup-time" class="block basis-4/12 ml-4" type="time" name="pickup_time" value="{{ explode(' ', gmdate('Y-m-d h:i \G\M\T'))[1] }}" required />
                     </div>
                     <x-label for="dropoff" value="Drop off" class="block font-bold text-base mt-6"/>
                     <div class="date-time flex">
-                        <x-input id="dropoff-date" class="block basis-8/12" type="date" name="dropoff-time" value="{{ date('Y-m-d', strtotime('tomorrow')) }}" required />
-                        <x-input id="dropoff-time" class="block basis-4/12 ml-4" type="time" name="dropoff-date" value="{{ explode(' ', gmdate('Y-m-d h:i \G\M\T'))[1] }}" required />
+                        <x-input id="dropoff-date" class="block basis-8/12" type="date" name="dropoff_date" value="{{ date('Y-m-d', strtotime('tomorrow')) }}" required />
+                        <x-input id="dropoff-time" class="block basis-4/12 ml-4" type="time" name="dropoff_time" value="{{ explode(' ', gmdate('Y-m-d h:i \G\M\T'))[1] }}" required />
                     </div>
+                    <input type="hidden" name="type" value="{{ strtolower($type) }}">
                     <div class="mt-6 flex justify-center">
                         <x-button filled="true">Rent Now</x-button>
                     </div>
diff --git a/resources/views/layouts/guest.blade.php b/resources/views/layouts/guest.blade.php
index 88c959f..a04e7bd 100644
--- a/resources/views/layouts/guest.blade.php
+++ b/resources/views/layouts/guest.blade.php
@@ -5,6 +5,8 @@
         <meta name="viewport" content="width=device-width, initial-scale=1">
         <meta name="csrf-token" content="{{ csrf_token() }}">
 
+        <link rel="icon" href="images/logo.ico" type="image/icon type">
+
         <title>{{ config('app.name', 'Laravel') }}</title>
 
         <!-- Fonts -->
diff --git a/resources/views/vehicles-list.blade.php b/resources/views/vehicles-list.blade.php
new file mode 100644
index 0000000..e69de29
diff --git a/routes/web.php b/routes/web.php
index f639464..8d85c87 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -37,13 +37,17 @@
 
 Route::get('/me/profile', [UserController::class, 'getUserProfile']);
 
-Route::get('/find/motor', [RentController::class, 'getFindVehicles']);
+Route::get('/find/motor', [RentController::class, 'getFindMotor']);
 
 Route::get('/find/car', [RentController::class, 'getFindCar']);
 
-Route::get('/rent/motors', [RentController::class, 'getRentMotors']);
+Route::post('/find/{type}', [RentController::class, 'findVehicles']);
 
-Route::get('/rent/cars', [RentController::class, 'getRentCars']);
+Route::post('/find/motor', [RentController::class, 'findMotor']);
+
+Route::get('/rent/motors', [RentController::class, 'getRentMotors'])->name('rent-motors');
+
+Route::get('/rent/cars', [RentController::class, 'getRentCars'])->name('rent-cars');
 
 Route::middleware(['auth', 'verified'])-> group(function () {
     Route::get('/rent/car/{id}', [RentController::class, 'getRentCarForm']);

From 43fa254d7896a288f8de9d6ef24dd81b3e0a3f86 Mon Sep 17 00:00:00 2001
From: Femi Novia Lina <77434812+FemiNoviaLina@users.noreply.github.com>
Date: Sat, 14 May 2022 00:21:22 +0700
Subject: [PATCH 2/3] add update profile

---
 app/Http/Controllers/RentController.php     |   6 +-
 app/Http/Controllers/UserController.php     |  15 +
 public/css/app.css                          | 586 +++++++++++---------
 public/js/navbar_script.js                  |   4 +-
 resources/js/navbar_script.js               |   4 +-
 resources/views/components/navbar.blade.php |  12 +-
 resources/views/user-profile.blade.php      |  38 ++
 routes/web.php                              |   3 +
 8 files changed, 396 insertions(+), 272 deletions(-)
 create mode 100644 resources/views/user-profile.blade.php

diff --git a/app/Http/Controllers/RentController.php b/app/Http/Controllers/RentController.php
index b8d5888..b02b55d 100644
--- a/app/Http/Controllers/RentController.php
+++ b/app/Http/Controllers/RentController.php
@@ -34,7 +34,7 @@ public function findVehicles() {
 
     public function getFindMotor()
     {
-        return view('find-vehicles');
+        return view('find-vehicles', ['type' => 'Motor']);
     }
 
     public function getRentCarForm()
@@ -49,11 +49,11 @@ public function getRentMotorForm()
 
     public function getRentCars()
     {
-        return view('vehicles-list', ['vehicles' => session('vehicles'), 'type' => 'Car']);
+        return view('vehicles-list', ['vehicles' => session('vehicles'), 'type' => 'car']);
     }
 
     public function getRentMotors()
     {
-        return view('vehicles-list');
+        return view('vehicles-list', ['vehicles' => session('vehicles'), 'type' => 'motor']);
     }
 }
diff --git a/app/Http/Controllers/UserController.php b/app/Http/Controllers/UserController.php
index 43957ae..b38e726 100644
--- a/app/Http/Controllers/UserController.php
+++ b/app/Http/Controllers/UserController.php
@@ -15,4 +15,19 @@ public function getUserOrders()
     {
         return view('order-history');
     }
+
+    public function updateProfile()
+    {
+        $request = request()->input();
+
+        $user = auth()->user();
+
+        $user->phone_1 = $request['phone_1'];
+        $user->phone_2 = $request['phone_2'];
+        $user->address_id = $request['address_id'];
+        $user->address_mlg = $request['address_mlg'];
+        $user->save();
+
+        return redirect()->route('index');
+    }
 }
diff --git a/public/css/app.css b/public/css/app.css
index 958879d..429a602 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -604,10 +604,6 @@ select {
 .relative {
   position: relative;
 }
-.sticky {
-  position: -webkit-sticky;
-  position: sticky;
-}
 .inset-x-0 {
   left: 0px;
   right: 0px;
@@ -615,15 +611,15 @@ select {
 .top-0 {
   top: 0px;
 }
+.-left-4 {
+  left: -1rem;
+}
 .right-0 {
   right: 0px;
 }
 .left-0 {
   left: 0px;
 }
-.-left-4 {
-  left: -1rem;
-}
 .z-0 {
   z-index: 0;
 }
@@ -633,9 +629,6 @@ select {
 .z-50 {
   z-index: 50;
 }
-.m-1 {
-  margin: 0.25rem;
-}
 .m-3 {
   margin: 0.75rem;
 }
@@ -645,13 +638,12 @@ select {
 .m-auto {
   margin: auto;
 }
-.mx-20 {
-  margin-left: 5rem;
-  margin-right: 5rem;
+.m-1 {
+  margin: 0.25rem;
 }
-.mx-8 {
-  margin-left: 2rem;
-  margin-right: 2rem;
+.mx-6 {
+  margin-left: 1.5rem;
+  margin-right: 1.5rem;
 }
 .mx-auto {
   margin-left: auto;
@@ -661,29 +653,29 @@ select {
   margin-left: 0.5rem;
   margin-right: 0.5rem;
 }
-.mx-6 {
-  margin-left: 1.5rem;
-  margin-right: 1.5rem;
+.my-6 {
+  margin-top: 1.5rem;
+  margin-bottom: 1.5rem;
+}
+.mx-20 {
+  margin-left: 5rem;
+  margin-right: 5rem;
 }
 .my-2 {
   margin-top: 0.5rem;
   margin-bottom: 0.5rem;
 }
-.my-6 {
-  margin-top: 1.5rem;
-  margin-bottom: 1.5rem;
-}
-.my-32 {
-  margin-top: 8rem;
-  margin-bottom: 8rem;
+.mx-8 {
+  margin-left: 2rem;
+  margin-right: 2rem;
 }
-.my-36 {
-  margin-top: 9rem;
-  margin-bottom: 9rem;
+.mx-1 {
+  margin-left: 0.25rem;
+  margin-right: 0.25rem;
 }
-.my-56 {
-  margin-top: 14rem;
-  margin-bottom: 14rem;
+.my-1 {
+  margin-top: 0.25rem;
+  margin-bottom: 0.25rem;
 }
 .ml-3 {
   margin-left: 0.75rem;
@@ -691,116 +683,113 @@ select {
 .-ml-px {
   margin-left: -1px;
 }
-.mb-4 {
-  margin-bottom: 1rem;
+.mt-3 {
+  margin-top: 0.75rem;
 }
-.mt-1 {
-  margin-top: 0.25rem;
+.mt-0 {
+  margin-top: 0px;
 }
-.mt-4 {
-  margin-top: 1rem;
+.mb-5 {
+  margin-bottom: 1.25rem;
 }
-.mt-6 {
-  margin-top: 1.5rem;
+.ml-2\.5 {
+  margin-left: 0.625rem;
 }
-.ml-4 {
-  margin-left: 1rem;
+.mt-8 {
+  margin-top: 2rem;
 }
 .ml-2 {
   margin-left: 0.5rem;
 }
-.mt-40 {
-  margin-top: 10rem;
-}
-.ml-56 {
-  margin-left: 14rem;
-}
-.mt-28 {
-  margin-top: 7rem;
+.ml-10 {
+  margin-left: 2.5rem;
 }
-.mt-8 {
-  margin-top: 2rem;
+.mt-2 {
+  margin-top: 0.5rem;
 }
-.ml-20 {
-  margin-left: 5rem;
+.mt-6 {
+  margin-top: 1.5rem;
 }
-.mt-16 {
-  margin-top: 4rem;
+.mr-6 {
+  margin-right: 1.5rem;
 }
-.mt-44 {
-  margin-top: 11rem;
+.mb-4 {
+  margin-bottom: 1rem;
 }
-.ml-12 {
-  margin-left: 3rem;
+.mt-1 {
+  margin-top: 0.25rem;
 }
-.ml-44 {
-  margin-left: 11rem;
+.mt-4 {
+  margin-top: 1rem;
 }
 .mt-24 {
   margin-top: 6rem;
 }
-.ml-8 {
-  margin-left: 2rem;
+.mr-2 {
+  margin-right: 0.5rem;
 }
-.mt-2 {
-  margin-top: 0.5rem;
+.mb-20 {
+  margin-bottom: 5rem;
 }
-.mb-2 {
-  margin-bottom: 0.5rem;
+.mb-10 {
+  margin-bottom: 2.5rem;
+}
+.ml-4 {
+  margin-left: 1rem;
 }
 .ml-1 {
   margin-left: 0.25rem;
 }
-.mr-2 {
-  margin-right: 0.5rem;
+.ml-12 {
+  margin-left: 3rem;
 }
 .-mt-px {
   margin-top: -1px;
 }
-.mb-5 {
-  margin-bottom: 1.25rem;
-}
-.ml-2\.5 {
-  margin-left: 0.625rem;
-}
-.ml-10 {
-  margin-left: 2.5rem;
-}
-.mr-6 {
-  margin-right: 1.5rem;
-}
 .mt-12 {
   margin-top: 3rem;
 }
-.mt-3 {
-  margin-top: 0.75rem;
+.ml-8 {
+  margin-left: 2rem;
 }
 .-mr-2 {
   margin-right: -0.5rem;
 }
-.mt-10 {
-  margin-top: 2.5rem;
+.mt-40 {
+  margin-top: 10rem;
+}
+.ml-56 {
+  margin-left: 14rem;
+}
+.mt-28 {
+  margin-top: 7rem;
+}
+.ml-20 {
+  margin-left: 5rem;
 }
-.mt-36 {
-  margin-top: 9rem;
+.mt-16 {
+  margin-top: 4rem;
+}
+.mt-44 {
+  margin-top: 11rem;
 }
-.mt-56 {
-  margin-top: 14rem;
+.ml-44 {
+  margin-left: 11rem;
 }
 .mt-32 {
   margin-top: 8rem;
 }
+.mb-2 {
+  margin-bottom: 0.5rem;
+}
 .mt-20 {
   margin-top: 5rem;
 }
-.mb-20 {
-  margin-bottom: 5rem;
-}
-.mb-10 {
-  margin-bottom: 2.5rem;
+.ml-24 {
+  margin-left: 6rem;
 }
-.mt-0 {
-  margin-top: 0px;
+.mt-10 {
+  margin-top: 2.5rem;
 }
 .block {
   display: block;
@@ -817,6 +806,9 @@ select {
 .inline-flex {
   display: inline-flex;
 }
+.table {
+  display: table;
+}
 .grid {
   display: grid;
 }
@@ -826,24 +818,6 @@ select {
 .h-5 {
   height: 1.25rem;
 }
-.h-7 {
-  height: 1.75rem;
-}
-.h-auto {
-  height: auto;
-}
-.h-9 {
-  height: 2.25rem;
-}
-.h-8 {
-  height: 2rem;
-}
-.h-16 {
-  height: 4rem;
-}
-.h-4 {
-  height: 1rem;
-}
 .h-1 {
   height: 0.25rem;
 }
@@ -853,23 +827,41 @@ select {
 .h-0 {
   height: 0px;
 }
-.h-full {
-  height: 100%;
+.h-4 {
+  height: 1rem;
 }
 .h-20 {
   height: 5rem;
 }
+.h-8 {
+  height: 2rem;
+}
+.h-16 {
+  height: 4rem;
+}
+.h-full {
+  height: 100%;
+}
 .h-10 {
   height: 2.5rem;
 }
 .h-6 {
   height: 1.5rem;
 }
-.h-screen {
-  height: 100vh;
+.h-7 {
+  height: 1.75rem;
+}
+.h-auto {
+  height: auto;
+}
+.h-9 {
+  height: 2.25rem;
+}
+.h-12 {
+  height: 3rem;
 }
-.max-h-screen {
-  max-height: 100vh;
+.h-11 {
+  height: 2.75rem;
 }
 .min-h-screen {
   min-height: 100vh;
@@ -877,23 +869,11 @@ select {
 .w-5 {
   width: 1.25rem;
 }
-.w-full {
-  width: 100%;
-}
-.w-7 {
-  width: 1.75rem;
-}
-.w-64 {
-  width: 16rem;
-}
-.w-72 {
-  width: 18rem;
-}
-.w-10 {
-  width: 2.5rem;
+.w-screen {
+  width: 100vw;
 }
-.w-36 {
-  width: 9rem;
+.w-24 {
+  width: 6rem;
 }
 .w-20 {
   width: 5rem;
@@ -901,8 +881,8 @@ select {
 .w-8 {
   width: 2rem;
 }
-.w-auto {
-  width: auto;
+.w-40 {
+  width: 10rem;
 }
 .w-6 {
   width: 1.5rem;
@@ -913,14 +893,14 @@ select {
 .w-3 {
   width: 0.75rem;
 }
-.w-screen {
-  width: 100vw;
+.w-full {
+  width: 100%;
 }
-.w-24 {
-  width: 6rem;
+.w-auto {
+  width: auto;
 }
-.w-40 {
-  width: 10rem;
+.w-3\/6 {
+  width: 50%;
 }
 .w-4\/5 {
   width: 80%;
@@ -934,23 +914,59 @@ select {
 .w-4 {
   width: 1rem;
 }
-.w-3\/6 {
-  width: 50%;
+.w-7 {
+  width: 1.75rem;
+}
+.w-64 {
+  width: 16rem;
+}
+.w-72 {
+  width: 18rem;
+}
+.w-10 {
+  width: 2.5rem;
+}
+.w-36 {
+  width: 9rem;
+}
+.w-5\/6 {
+  width: 83.333333%;
+}
+.w-10\/12 {
+  width: 83.333333%;
+}
+.w-11\/12 {
+  width: 91.666667%;
+}
+.w-8\/12 {
+  width: 66.666667%;
+}
+.w-0\.5 {
+  width: 0.125rem;
+}
+.w-0 {
+  width: 0px;
+}
+.w-2\.5 {
+  width: 0.625rem;
+}
+.w-2 {
+  width: 0.5rem;
+}
+.max-w-7xl {
+  max-width: 80rem;
 }
 .max-w-xl {
   max-width: 36rem;
 }
-.max-w-md {
-  max-width: 28rem;
+.max-w-6xl {
+  max-width: 72rem;
 }
 .max-w-4xl {
   max-width: 56rem;
 }
-.max-w-6xl {
-  max-width: 72rem;
-}
-.max-w-7xl {
-  max-width: 80rem;
+.max-w-md {
+  max-width: 28rem;
 }
 .flex-1 {
   flex: 1 1 0%;
@@ -964,6 +980,12 @@ select {
 .basis-3\/4 {
   flex-basis: 75%;
 }
+.basis-8\/12 {
+  flex-basis: 66.666667%;
+}
+.basis-4\/12 {
+  flex-basis: 33.333333%;
+}
 .basis-1\/2 {
   flex-basis: 50%;
 }
@@ -973,12 +995,6 @@ select {
 .basis-3\/12 {
   flex-basis: 25%;
 }
-.basis-8\/12 {
-  flex-basis: 66.666667%;
-}
-.basis-4\/12 {
-  flex-basis: 33.333333%;
-}
 .origin-top-left {
   transform-origin: top left;
 }
@@ -1022,6 +1038,9 @@ select {
 .grid-rows-2 {
   grid-template-rows: repeat(2, minmax(0, 1fr));
 }
+.grid-rows-4 {
+  grid-template-rows: repeat(4, minmax(0, 1fr));
+}
 .flex-col {
   flex-direction: column;
 }
@@ -1046,9 +1065,6 @@ select {
 .justify-between {
   justify-content: space-between;
 }
-.justify-evenly {
-  justify-content: space-evenly;
-}
 .justify-items-center {
   justify-items: center;
 }
@@ -1061,6 +1077,16 @@ select {
 .gap-8 {
   gap: 2rem;
 }
+.gap-1 {
+  gap: 0.25rem;
+}
+.gap-5 {
+  gap: 1.25rem;
+}
+.gap-x-5 {
+  -moz-column-gap: 1.25rem;
+       column-gap: 1.25rem;
+}
 .space-x-8 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(2rem * var(--tw-space-x-reverse));
@@ -1074,27 +1100,30 @@ select {
 .overflow-hidden {
   overflow: hidden;
 }
-.overflow-x-hidden {
-  overflow-x: hidden;
+.text-ellipsis {
+  text-overflow: ellipsis;
 }
 .whitespace-nowrap {
   white-space: nowrap;
 }
+.break-all {
+  word-break: break-all;
+}
 .rounded-md {
   border-radius: 0.375rem;
 }
-.rounded-full {
-  border-radius: 9999px;
-}
-.rounded-2xl {
-  border-radius: 1rem;
-}
 .rounded-lg {
   border-radius: 0.5rem;
 }
+.rounded-full {
+  border-radius: 9999px;
+}
 .rounded {
   border-radius: 0.25rem;
 }
+.rounded-2xl {
+  border-radius: 1rem;
+}
 .rounded-l-md {
   border-top-left-radius: 0.375rem;
   border-bottom-left-radius: 0.375rem;
@@ -1117,6 +1146,12 @@ select {
 .border-2 {
   border-width: 2px;
 }
+.border-0 {
+  border-width: 0px;
+}
+.border-l-2 {
+  border-left-width: 2px;
+}
 .border-t {
   border-top-width: 1px;
 }
@@ -1132,21 +1167,18 @@ select {
 .border-l-4 {
   border-left-width: 4px;
 }
-.border-l-2 {
-  border-left-width: 2px;
-}
 .border-gray-300 {
   --tw-border-opacity: 1;
   border-color: rgb(243 244 248 / var(--tw-border-opacity));
 }
-.border-lilac-100 {
-  --tw-border-opacity: 1;
-  border-color: rgb(124 125 220 / var(--tw-border-opacity));
-}
 .border-gray-50 {
   --tw-border-opacity: 1;
   border-color: rgb(93 93 148 / var(--tw-border-opacity));
 }
+.border-lilac-100 {
+  --tw-border-opacity: 1;
+  border-color: rgb(124 125 220 / var(--tw-border-opacity));
+}
 .border-transparent {
   border-color: transparent;
 }
@@ -1154,6 +1186,10 @@ select {
   --tw-border-opacity: 1;
   border-color: rgb(226 226 226 / var(--tw-border-opacity));
 }
+.border-black {
+  --tw-border-opacity: 1;
+  border-color: rgb(0 0 0 / var(--tw-border-opacity));
+}
 .bg-white {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@@ -1162,10 +1198,6 @@ select {
   --tw-bg-opacity: 1;
   background-color: rgb(124 125 220 / var(--tw-bg-opacity));
 }
-.bg-gray-100 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(226 226 226 / var(--tw-bg-opacity));
-}
 .bg-gray-300 {
   --tw-bg-opacity: 1;
   background-color: rgb(243 244 248 / var(--tw-bg-opacity));
@@ -1174,6 +1206,10 @@ select {
   --tw-bg-opacity: 1;
   background-color: rgb(93 93 148 / var(--tw-bg-opacity));
 }
+.bg-gray-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(226 226 226 / var(--tw-bg-opacity));
+}
 .bg-cover {
   background-size: cover;
 }
@@ -1189,14 +1225,8 @@ select {
 .fill-lilac-100 {
   fill: #7C7DDC;
 }
-.p-5 {
-  padding: 1.25rem;
-}
-.p-2 {
-  padding: 0.5rem;
-}
-.p-6 {
-  padding: 1.5rem;
+.p-3 {
+  padding: 0.75rem;
 }
 .p-10 {
   padding: 2.5rem;
@@ -1204,8 +1234,14 @@ select {
 .p-4 {
   padding: 1rem;
 }
-.p-3 {
-  padding: 0.75rem;
+.p-2 {
+  padding: 0.5rem;
+}
+.p-6 {
+  padding: 1.5rem;
+}
+.p-5 {
+  padding: 1.25rem;
 }
 .px-4 {
   padding-left: 1rem;
@@ -1219,6 +1255,10 @@ select {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
 }
+.py-1 {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
 .px-6 {
   padding-left: 1.5rem;
   padding-right: 1.5rem;
@@ -1227,9 +1267,9 @@ select {
   padding-top: 1rem;
   padding-bottom: 1rem;
 }
-.py-1 {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+.px-10 {
+  padding-left: 2.5rem;
+  padding-right: 2.5rem;
 }
 .px-20 {
   padding-left: 5rem;
@@ -1239,6 +1279,14 @@ select {
   padding-top: 2.5rem;
   padding-bottom: 2.5rem;
 }
+.px-12 {
+  padding-left: 3rem;
+  padding-right: 3rem;
+}
+.py-20 {
+  padding-top: 5rem;
+  padding-bottom: 5rem;
+}
 .py-12 {
   padding-top: 3rem;
   padding-bottom: 3rem;
@@ -1251,51 +1299,34 @@ select {
   padding-top: 1.5rem;
   padding-bottom: 1.5rem;
 }
-.px-12 {
-  padding-left: 3rem;
-  padding-right: 3rem;
+.px-0 {
+  padding-left: 0px;
+  padding-right: 0px;
 }
-.py-20 {
-  padding-top: 5rem;
-  padding-bottom: 5rem;
+.pl-1 {
+  padding-left: 0.25rem;
 }
-.px-10 {
+.pl-10 {
   padding-left: 2.5rem;
-  padding-right: 2.5rem;
-}
-.pt-52 {
-  padding-top: 13rem;
-}
-.pl-24 {
-  padding-left: 6rem;
-}
-.pt-4 {
-  padding-top: 1rem;
 }
-.pt-44 {
-  padding-top: 11rem;
+.pt-1 {
+  padding-top: 0.25rem;
 }
 .pt-8 {
   padding-top: 2rem;
 }
-.pl-10 {
-  padding-left: 2.5rem;
-}
-.pl-1 {
-  padding-left: 0.25rem;
-}
 .pl-4 {
   padding-left: 1rem;
 }
+.pt-4 {
+  padding-top: 1rem;
+}
 .pl-2 {
   padding-left: 0.5rem;
 }
 .pt-2 {
   padding-top: 0.5rem;
 }
-.pt-1 {
-  padding-top: 0.25rem;
-}
 .pl-3 {
   padding-left: 0.75rem;
 }
@@ -1308,6 +1339,15 @@ select {
 .pb-1 {
   padding-bottom: 0.25rem;
 }
+.pt-52 {
+  padding-top: 13rem;
+}
+.pl-24 {
+  padding-left: 6rem;
+}
+.pt-44 {
+  padding-top: 11rem;
+}
 .text-center {
   text-align: center;
 }
@@ -1318,50 +1358,50 @@ select {
   font-size: 0.875rem;
   line-height: 1.25rem;
 }
-.text-3xl {
-  font-size: 1.875rem;
-  line-height: 2.25rem;
-}
-.text-5xl {
-  font-size: 3rem;
-  line-height: 1;
-}
 .text-lg {
   font-size: 1.125rem;
   line-height: 1.75rem;
 }
+.text-base {
+  font-size: 1rem;
+  line-height: 1.5rem;
+}
+.text-3xl {
+  font-size: 1.875rem;
+  line-height: 2.25rem;
+}
 .text-4xl {
   font-size: 2.25rem;
   line-height: 2.5rem;
 }
-.text-2xl {
-  font-size: 1.5rem;
-  line-height: 2rem;
-}
 .text-xl {
   font-size: 1.25rem;
   line-height: 1.75rem;
 }
+.text-5xl {
+  font-size: 3rem;
+  line-height: 1;
+}
+.text-2xl {
+  font-size: 1.5rem;
+  line-height: 2rem;
+}
 .text-xs {
   font-size: 0.75rem;
   line-height: 1rem;
 }
-.text-base {
-  font-size: 1rem;
-  line-height: 1.5rem;
-}
 .font-medium {
   font-weight: 500;
 }
 .font-bold {
   font-weight: 700;
 }
-.font-semibold {
-  font-weight: 600;
-}
 .font-normal {
   font-weight: 400;
 }
+.font-semibold {
+  font-weight: 600;
+}
 .font-extrabold {
   font-weight: 800;
 }
@@ -1384,29 +1424,29 @@ select {
   --tw-text-opacity: 1;
   color: rgb(124 125 220 / var(--tw-text-opacity));
 }
-.text-black {
+.text-gray-50 {
   --tw-text-opacity: 1;
-  color: rgb(0 0 0 / var(--tw-text-opacity));
+  color: rgb(93 93 148 / var(--tw-text-opacity));
 }
 .text-white {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
-.text-lilac-200 {
-  --tw-text-opacity: 1;
-  color: rgb(147 149 222 / var(--tw-text-opacity));
-}
-.text-lilac-300 {
+.text-black {
   --tw-text-opacity: 1;
-  color: rgb(169 169 231 / var(--tw-text-opacity));
+  color: rgb(0 0 0 / var(--tw-text-opacity));
 }
 .text-gray-300 {
   --tw-text-opacity: 1;
   color: rgb(243 244 248 / var(--tw-text-opacity));
 }
-.text-gray-50 {
+.text-lilac-200 {
   --tw-text-opacity: 1;
-  color: rgb(93 93 148 / var(--tw-text-opacity));
+  color: rgb(147 149 222 / var(--tw-text-opacity));
+}
+.text-lilac-300 {
+  --tw-text-opacity: 1;
+  color: rgb(169 169 231 / var(--tw-text-opacity));
 }
 .underline {
   -webkit-text-decoration-line: underline;
@@ -1468,15 +1508,15 @@ select {
 .duration-150 {
   transition-duration: 150ms;
 }
+.duration-500 {
+  transition-duration: 500ms;
+}
 .duration-200 {
   transition-duration: 200ms;
 }
 .duration-75 {
   transition-duration: 75ms;
 }
-.duration-500 {
-  transition-duration: 500ms;
-}
 .ease-in-out {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
@@ -1570,14 +1610,6 @@ select {
   --tw-bg-opacity: 1;
   background-color: rgb(124 125 220 / var(--tw-bg-opacity));
 }
-.hover\:bg-gray-100:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(226 226 226 / var(--tw-bg-opacity));
-}
-.hover\:bg-gray-50:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(93 93 148 / var(--tw-bg-opacity));
-}
 .hover\:bg-lilac-300:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(169 169 231 / var(--tw-bg-opacity));
@@ -1586,6 +1618,14 @@ select {
   --tw-bg-opacity: 1;
   background-color: rgb(147 149 222 / var(--tw-bg-opacity));
 }
+.hover\:bg-gray-100:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(226 226 226 / var(--tw-bg-opacity));
+}
+.hover\:bg-gray-50:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(93 93 148 / var(--tw-bg-opacity));
+}
 .hover\:text-white:hover {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
@@ -1668,6 +1708,10 @@ select {
     flex-basis: 100%;
   }
 
+  .sm\:grid-cols-1 {
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+  }
+
   .sm\:items-center {
     align-items: center;
   }
@@ -1714,6 +1758,10 @@ select {
   .md\:grid-cols-2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
+
+  .md\:grid-cols-1 {
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+  }
 }
 @media (min-width: 1024px) {
 
@@ -1729,6 +1777,18 @@ select {
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }
 
+  .lg\:grid-cols-1 {
+    grid-template-columns: repeat(1, minmax(0, 1fr));
+  }
+
+  .lg\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  .lg\:grid-rows-4 {
+    grid-template-rows: repeat(4, minmax(0, 1fr));
+  }
+
   .lg\:px-8 {
     padding-left: 2rem;
     padding-right: 2rem;
diff --git a/public/js/navbar_script.js b/public/js/navbar_script.js
index ca8ff16..f08faa4 100644
--- a/public/js/navbar_script.js
+++ b/public/js/navbar_script.js
@@ -11,12 +11,12 @@ var menuOption = document.getElementsByClassName('rent-menu-option');
 
 menuOption[0].onclick = function (event) {
   event.preventDefault();
-  window.location.href = window.location.origin + '/rent/cars';
+  window.location.href = window.location.origin + '/find/car';
 };
 
 menuOption[1].onclick = function (event) {
   event.preventDefault();
-  window.location.href = window.location.origin + '/rent/motors';
+  window.location.href = window.location.origin + '/find/motor';
 };
 
 showButton.onclick = function (event) {
diff --git a/resources/js/navbar_script.js b/resources/js/navbar_script.js
index 55f7742..d260171 100644
--- a/resources/js/navbar_script.js
+++ b/resources/js/navbar_script.js
@@ -6,12 +6,12 @@ const menuOption = document.getElementsByClassName('rent-menu-option');
 
 menuOption[0].onclick = (event) => {
     event.preventDefault();
-    window.location.href = window.location.origin + '/rent/cars';
+    window.location.href = window.location.origin + '/find/car';
 }
 
 menuOption[1].onclick = (event) => {
     event.preventDefault();
-    window.location.href = window.location.origin + '/rent/motors';
+    window.location.href = window.location.origin + '/find/motor';
 }
 
 showButton.onclick = (event) => {
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index c6dbe30..31a034e 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -16,12 +16,12 @@
                             <p class="inline-block w-8 px-2 text-center {{ $isSelected($value) ? 'font-bold' : '' }}"> {{ $value }} </p>
                                 @if($isRent($value)) 
                                     <img src="{{ asset('images/down-arrow.svg') }}" class="inline-block w-5 ml-3 pl-1">
-                                    <div id="rent-menu" class="rent-menu z-10 hidden absolute w-40 font-normal">
+                                    <div id="rent-menu" class="rent-menu z-10 hidden absolute w-40 font-normal bg-white">
                                         <div class="rent-menu-option px-2 py-1 bg-gray hover:bg-lilac-100 hover:text-white">
                                             Rent Car
                                         </div>
                                         <div class="rent-menu-option px-2 py-1 bg-gray hover:bg-lilac-100 hover:text-white">
-                                            Rent Motorcycle </a>
+                                            Rent Motorcycle
                                         </div>
                                     </div>
                                 @endif
@@ -39,6 +39,14 @@
                 </a>
                 @endguest
                 @auth
+                <a href="{{ '/me/profile' }}"><div class="mx-2 my-1 border border-black px-2 py-1 rounded-lg w-20 h-11 text-ellipsis overflow-hidden">
+                    @if(auth()->user()->hasRole('admin'))
+                    <p class="text-xs">Admin</p>
+                    @else
+                    <p class="text-xs">Customer</p>
+                    @endif
+                    <p class="text-sm font-bold text-lilac-100">{{ auth()->user()->name }}</p>
+                </div></a>
                 <form action="{{ url('/logout') }}" method="post">
                     @csrf
                     <x-button filled=true> {{ __('Logout') }}</x-button>
diff --git a/resources/views/user-profile.blade.php b/resources/views/user-profile.blade.php
new file mode 100644
index 0000000..e0ce5ac
--- /dev/null
+++ b/resources/views/user-profile.blade.php
@@ -0,0 +1,38 @@
+<x-base-layout>
+    <x-base-body selected="">
+        <h1 class="font-bold text-3xl text-lilac-100 mt-24 ml-20">Let's Complete Your Profile</h1>
+        <h2 class="font-bold text-xl text-lilac-100 ml-20">Regarding to our terms, we need more information for vehicle rental purposes</h2>
+        <div class="min-h-screen flex flex-col items-center sm:pt-0 bg-">
+            <form action="{{ '/me/profile' }}" method="post" class="w-11/12 max-w-7xl mt-4 px-12 py-4 bg-white shadow-md overflow-hidden sm:rounded-lg grid spec-container lg:grid-cols-2 lg:grid-rows-4 gap-x-5 grid-cols-1 grid-row-8">
+                <div>
+                    <x-label for="name" value="Full Name" class="block font-bold text-base"/>
+                    <x-input id="name" class="block" type="text" name="name" value="{{ Auth::user()->name }}" required disabled />
+                </div>
+                <div>
+                    <x-label for="email" value="Email" class="block font-bold text-base"/>
+                    <x-input id="email" class="block" type="email" name="email" value="{{ Auth::user()->email }}" required disabled />
+                </div>
+                <div>
+                    <x-label for="phone_1" value="Phone Number 1" class="block font-bold text-base"/>
+                    <x-input id="phone-1" class="block" type="text" name="phone_1" value="" required autofocus />
+                </div>
+                <div>
+                    <x-label for="phone_2" value="Phone Number 2" class="block font-bold text-base"/>
+                    <x-input id="phone-2" class="block" type="text" name="phone_2" value="" required />
+                </div>
+                <div>
+                    <x-label for="address_id" value="Address (According to your ID card)" class="inline-block font-bold text-base"/>
+                    <x-text-area id="address-id" class="block" name="address_id" required/>
+                </div>
+                <div>
+                    <x-label for="address_mlg" value="Address (Malang)" class="inline-block font-bold text-base"/>
+                    <x-text-area id="address-mlg" class="block" name="address_mlg" required/>
+                </div>
+                <div class="flex items-center">
+                    <x-button filled="true" class="px-0">Save</x-button>
+                </div>
+                @csrf
+            </form>
+        </div>
+    </x-base-body>
+</x-base-layout>
\ No newline at end of file
diff --git a/routes/web.php b/routes/web.php
index 8d85c87..34c5c9d 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -3,6 +3,7 @@
 use Illuminate\Support\Facades\Route;
 use App\Http\Controllers\BasicViewController;
 use App\Http\Controllers\RentController;
+use App\Http\Controllers\UserController;
 
 /*
 |--------------------------------------------------------------------------
@@ -37,6 +38,8 @@
 
 Route::get('/me/profile', [UserController::class, 'getUserProfile']);
 
+Route::post('/me/profile', [UserController::class, 'updateProfile']);
+
 Route::get('/find/motor', [RentController::class, 'getFindMotor']);
 
 Route::get('/find/car', [RentController::class, 'getFindCar']);

From 53a536ae629d3890bff606f5fe4714d3526c0c5f Mon Sep 17 00:00:00 2001
From: Femi Novia Lina <77434812+FemiNoviaLina@users.noreply.github.com>
Date: Sat, 14 May 2022 00:41:48 +0700
Subject: [PATCH 3/3] modify navbar

---
 public/js/navbar_script.js                  | 10 +++++-----
 resources/js/navbar_script.js               | 10 +++++-----
 resources/views/components/navbar.blade.php | 20 ++++++++++++--------
 routes/web.php                              |  1 +
 4 files changed, 23 insertions(+), 18 deletions(-)

diff --git a/public/js/navbar_script.js b/public/js/navbar_script.js
index f08faa4..19925a7 100644
--- a/public/js/navbar_script.js
+++ b/public/js/navbar_script.js
@@ -9,6 +9,11 @@ var toggleMenu = document.getElementById('menu-toggle');
 var menuList = document.getElementById('menu-list');
 var menuOption = document.getElementsByClassName('rent-menu-option');
 
+toggleMenu.onclick = function (event) {
+  event.preventDefault();
+  menuList.style.maxHeight = menuList.style.maxHeight == '0px' ? '1000px' : '0px';
+};
+
 menuOption[0].onclick = function (event) {
   event.preventDefault();
   window.location.href = window.location.origin + '/find/car';
@@ -23,10 +28,5 @@ showButton.onclick = function (event) {
   event.preventDefault();
   showMenu.style.display = showMenu.style.display == 'none' ? 'block' : 'none';
 };
-
-toggleMenu.onclick = function (event) {
-  event.preventDefault();
-  menuList.style.maxHeight = menuList.style.maxHeight == '0px' ? '1000px' : '0px';
-};
 /******/ })()
 ;
\ No newline at end of file
diff --git a/resources/js/navbar_script.js b/resources/js/navbar_script.js
index d260171..f81b6be 100644
--- a/resources/js/navbar_script.js
+++ b/resources/js/navbar_script.js
@@ -4,6 +4,11 @@ const toggleMenu = document.getElementById('menu-toggle');
 const menuList = document.getElementById('menu-list');
 const menuOption = document.getElementsByClassName('rent-menu-option');
 
+toggleMenu.onclick = (event) => {
+    event.preventDefault();
+    menuList.style.maxHeight = menuList.style.maxHeight == '0px' ? '1000px': '0px';
+}
+
 menuOption[0].onclick = (event) => {
     event.preventDefault();
     window.location.href = window.location.origin + '/find/car';
@@ -17,9 +22,4 @@ menuOption[1].onclick = (event) => {
 showButton.onclick = (event) => {
     event.preventDefault();
     showMenu.style.display = showMenu.style.display == 'none' ? 'block': 'none';
-}
-
-toggleMenu.onclick = (event) => {
-    event.preventDefault();
-    menuList.style.maxHeight = menuList.style.maxHeight == '0px' ? '1000px': '0px';
 }
\ No newline at end of file
diff --git a/resources/views/components/navbar.blade.php b/resources/views/components/navbar.blade.php
index 31a034e..4e7116f 100644
--- a/resources/views/components/navbar.blade.php
+++ b/resources/views/components/navbar.blade.php
@@ -2,19 +2,23 @@
     <div class="w-screen h-1 bg-lilac-100"></div>
     <div class="navbar flex justify-between">
         <a href="{{ url('/') }}"><div class="navbar-logo basis-1/4 text-lilac-100">Rent.ly</div></a>
-        <div class="basis-3/4 flex justify-between sm:max-h-0 md:max-h-0" id="menu-list">
+        <div class="basis-3/4 flex justify-between sm:max-h-0 md:max-h-0 bg-white" id="menu-list">
             <div class="navbar-links flex p-3 m-3">
                 @guest
-                <?php $values = array('Rent', 'Guide', 'Help', 'About'); ?>
+                <?php $values = array('Rent' => 'rent', 'Guide' => 'guide', 'Help' => 'help', 'About' => 'about'); ?>
                 @endguest
                 @auth
-                <?php $values = array('Rent', 'My order', 'Guide', 'Help', 'About'); ?>
+                    @if(auth()->user()->hasRole('user'))
+                    <?php $values = array('Rent' => 'rent', 'My order' => 'me/order', 'Guide' => 'guide', 'Help' => 'help', 'About' => 'about'); ?>
+                    @else
+                    <?php $values = array('Order' => 'dashboard/orders', 'Product' => 'dashboard/vehicles', 'Customer' => 'dashboard/customers') ?>
+                    @endif 
                 @endauth
-                @foreach($values as $value)
-                    <a href="{{ $isRent($value) ? '' : url(strtolower($value)) }}">
-                        <div id="{{ $isRent($value) ? 'rent-button' : '' }}" class="relative navbar-option mx-6 whitespace-nowrap {{ Auth::check() ? 'w-24' : 'w-20' }}">
-                            <p class="inline-block w-8 px-2 text-center {{ $isSelected($value) ? 'font-bold' : '' }}"> {{ $value }} </p>
-                                @if($isRent($value)) 
+                @foreach($values as $key => $value)
+                    <a href="{{ $isRent($key) ? '' : url($value) }}">
+                        <div id="{{ $isRent($key) ? 'rent-button' : '' }}" class="relative navbar-option mx-6 whitespace-nowrap {{ Auth::check() ? 'w-24' : 'w-20' }}">
+                            <p class="inline-block w-8 px-2 text-center {{ $isSelected($key) ? 'font-bold' : '' }}"> {{ $key }} </p>
+                                @if($isRent($key)) 
                                     <img src="{{ asset('images/down-arrow.svg') }}" class="inline-block w-5 ml-3 pl-1">
                                     <div id="rent-menu" class="rent-menu z-10 hidden absolute w-40 font-normal bg-white">
                                         <div class="rent-menu-option px-2 py-1 bg-gray hover:bg-lilac-100 hover:text-white">
diff --git a/routes/web.php b/routes/web.php
index 34c5c9d..888b6f7 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -4,6 +4,7 @@
 use App\Http\Controllers\BasicViewController;
 use App\Http\Controllers\RentController;
 use App\Http\Controllers\UserController;
+use App\Http\Controllers\AdminController;
 
 /*
 |--------------------------------------------------------------------------