Implemented notes

app/Http/Controllers/Note.php

@@ -0,0 +1,73 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+
+class Note extends Controller
+{
+    public function show()
+    {
+        return view('note', [
+            'list' => \App\Models\Note::query()->where('notes.user_id', auth()->id())->get('*')
+        ]);
+    }
+
+    public function create()
+    {
+        return view('newnote');
+    }
+
+    public function newNote(Request $request)
+    {
+        $note = \App\Models\Note::query()->create(
+            [
+                'name' => $request->input('title'),
+                'description' => $request->input('description'),
+                'user_id' => $request->user()->id,
+            ]
+        );
+
+        $note->save();
+
+        return redirect(route('note.edit', $note->id));
+    }
+
+    public function save($id, Request $request) {
+        $note = \App\Models\Note::query()->where('notes.id', $id)->update(
+            [
+                'notes' => $request->input('comment'),
+            ]
+        );
+
+        return redirect(route('note.show', $id));
+    }
+
+    public function view($id)
+    {
+        return view('viewnote', [
+            'render' => \App\Models\Note::query()->where('id', $id)->find($id)
+        ]);
+    }
+
+    public function edit($id)
+    {
+        return view('editnote', [
+            'notes' => \App\Models\Note::query()->where('id', $id)->find($id)
+        ]);
+    }
+
+    public function confirmDelete($id)
+    {
+        return view('deletenote', [
+            'confirm' => \App\Models\Note::query()->find($id)
+        ]);
+    }
+
+    public function deleteConfirmed($id)
+    {
+        \App\Models\Note::query()->find($id)->delete();
+
+        return redirect(route('note.show'));
+    }
+}

app/Models/Note.php

@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+
+class Note extends Model
+{
+    use HasFactory;
+
+    protected $fillable = [
+        'name',
+        'description',
+        'note',
+        'user_id'
+    ];
+
+    public function User()
+    {
+        return $this->belongsTo(User::class);
+    }
+}

app/Models/User.php

@@ -49,6 +49,11 @@ public function Comment()
         return $this->hasMany(Comment::class);
     }
 
+    public function Note()
+    {
+        return $this->hasMany(Note::class);
+    }
+
     /**
      * The attributes that are mass assignable.
      *

database/migrations/2022_03_13_164437_create_notes_table.php

@@ -0,0 +1,35 @@
+<?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::create('notes', function (Blueprint $table) {
+            $table->id();
+            $table->string('name')->nullable(false);
+            $table->string('description')->nullable(true);
+            $table->text('notes')->nullable(true);
+            $table->integer('user_id')->nullable(false);
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     *
+     * @return void
+     */
+    public function down()
+    {
+        Schema::dropIfExists('notes');
+    }
+};

resources/views/deletenote.blade.php

@@ -0,0 +1,158 @@
+<x-app-layout>
+    <x-slot name="header">
+        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
+            {{ __('Notes') }}
+        </h2>
+    </x-slot>
+
+    <div class="min-h-full">
+
+        <!-- Main column -->
+        <div class="lg:pl-64 flex flex-col">
+            <!-- Search header -->
+            <div class="sticky top-0 z-10 flex-shrink-0 flex h-16 bg-white border-b border-gray-200 lg:hidden">
+                <!-- Sidebar toggle, controls the 'sidebarOpen' sidebar state. -->
+                <button @click="menu = true" type="button"
+                        class="px-4 border-r border-gray-200 text-gray-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-purple-500 lg:hidden">
+                    <span class="sr-only">Open sidebar</span>
+                    <!-- Heroicon name: outline/menu-alt-1 -->
+                    <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+                         stroke="currentColor" aria-hidden="true">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                              d="M4 6h16M4 12h8m-8 6h16"/>
+                    </svg>
+                </button>
+                <div class="flex-1 flex justify-between px-4 sm:px-6 lg:px-8">
+                    <div class="flex-1 flex">
+                        <form class="w-full flex md:ml-0" action="#" method="GET">
+                            <label for="search-field" class="sr-only">Search</label>
+                            <div class="relative w-full text-gray-400 focus-within:text-gray-600">
+                                <div class="absolute inset-y-0 left-0 flex items-center pointer-events-none">
+                                    <!-- Heroicon name: solid/search -->
+                                    <svg class="h-5 w-5" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
+                                         fill="currentColor" aria-hidden="true">
+                                        <path fill-rule="evenodd"
+                                              d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z"
+                                              clip-rule="evenodd"/>
+                                    </svg>
+                                </div>
+                                <input id="search-field" name="search-field"
+                                       class="block w-full h-full pl-8 pr-3 py-2 border-transparent text-gray-900 placeholder-gray-500 focus:outline-none focus:ring-0 focus:border-transparent focus:placeholder-gray-400 sm:text-sm"
+                                       placeholder="Search" type="search">
+                            </div>
+                        </form>
+                    </div>
+                    <div class="flex items-center">
+                        <!-- Profile dropdown -->
+                        <div class="ml-3 relative">
+                            <div>
+                                <button @click="profile = true" type="button"
+                                        class="max-w-xs bg-white flex items-center text-sm rounded-full focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-purple-500"
+                                        id="user-menu-button" aria-expanded="false" aria-haspopup="true">
+                                    <span class="sr-only">Open user menu</span>
+                                    <img class="h-8 w-8 rounded-full"
+                                         src="https://images.unsplash.com/photo-1502685104226-ee32379fefbe?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
+                                         alt="">
+                                </button>
+                            </div>
+
+                            <!--
+                              Dropdown menu, show/hide based on menu state.
+
+                              Entering: "transition ease-out duration-100"
+                                From: "transform opacity-0 scale-95"
+                                To: "transform opacity-100 scale-100"
+                              Leaving: "transition ease-in duration-75"
+                                From: "transform opacity-100 scale-100"
+                                To: "transform opacity-0 scale-95"
+                            -->
+                            <div x-show="profile" x-cloak
+                                 class="origin-top-right absolute right-0 mt-2 w-48 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 divide-y divide-gray-200 focus:outline-none"
+                                 role="menu" aria-orientation="vertical" aria-labelledby="user-menu-button"
+                                 tabindex="-1">
+                                <div class="py-1" role="none">
+                                    <!-- Active: "bg-gray-100 text-gray-900", Not Active: "text-gray-700" -->
+                                    <a href="#" class="text-gray-700 block px-4 py-2 text-sm" role="menuitem"
+                                       tabindex="-1" id="user-menu-item-0">View profile</a>
+                                    <a href="#" class="text-gray-700 block px-4 py-2 text-sm" role="menuitem"
+                                       tabindex="-1" id="user-menu-item-1">Settings</a>
+                                    <a href="#" class="text-gray-700 block px-4 py-2 text-sm" role="menuitem"
+                                       tabindex="-1" id="user-menu-item-2">Notifications</a>
+                                </div>
+                                <div class="py-1" role="none">
+                                    <a href="#" class="text-gray-700 block px-4 py-2 text-sm" role="menuitem"
+                                       tabindex="-1" id="user-menu-item-3">Get desktop app</a>
+                                    <a href="#" class="text-gray-700 block px-4 py-2 text-sm" role="menuitem"
+                                       tabindex="-1" id="user-menu-item-4">Support</a>
+                                </div>
+                                <div class="py-1" role="none">
+                                    <a href="#" class="text-gray-700 block px-4 py-2 text-sm" role="menuitem"
+                                       tabindex="-1" id="user-menu-item-5">Logout</a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <main class="flex-1">
+
+                <!-- This example requires Tailwind CSS v2.0+ -->
+                <div class="fixed z-10 inset-0 overflow-y-auto" aria-labelledby="modal-title" role="dialog" aria-modal="true">
+                    <div class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
+                        <!--
+                          Background overlay, show/hide based on modal state.
+
+                          Entering: "ease-out duration-300"
+                            From: "opacity-0"
+                            To: "opacity-100"
+                          Leaving: "ease-in duration-200"
+                            From: "opacity-100"
+                            To: "opacity-0"
+                        -->
+                        <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" aria-hidden="true"></div>
+
+                        <!-- This element is to trick the browser into centering the modal contents. -->
+                        <span class="hidden sm:inline-block sm:align-middle sm:h-screen" aria-hidden="true">&#8203;</span>
+
+                        <!--
+                          Modal panel, show/hide based on modal state.
+
+                          Entering: "ease-out duration-300"
+                            From: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
+                            To: "opacity-100 translate-y-0 sm:scale-100"
+                          Leaving: "ease-in duration-200"
+                            From: "opacity-100 translate-y-0 sm:scale-100"
+                            To: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
+                        -->
+                        <div class="relative inline-block align-bottom bg-white rounded-lg px-4 pt-5 pb-4 text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full sm:p-6">
+                            <div class="sm:flex sm:items-start">
+                                <div class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-red-100 sm:mx-0 sm:h-10 sm:w-10">
+                                    <!-- Heroicon name: outline/exclamation -->
+                                    <svg class="h-6 w-6 text-red-600" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
+                                    </svg>
+                                </div>
+                                <div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
+                                    <h3 class="text-lg leading-6 font-medium text-gray-900" id="modal-title">Delete this note</h3>
+                                    <div class="mt-2">
+                                        <p class="text-sm text-gray-500">Are you sure you want to delete this note called "{{$confirm->name}}"? <b>This action is permanent and can't be reverted.</b></p>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="mt-5 sm:mt-4 sm:ml-10 sm:pl-4 sm:flex">
+                                <form method="post" action="{{ route('note.confirmed-delete', $confirm->id) }}">
+                                    @csrf
+                                    <button type="submit" class="inline-flex justify-center w-full rounded-md border border-transparent shadow-sm px-4 py-2 bg-red-600 text-base font-medium text-white hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 sm:w-auto sm:text-sm">Delete</button>
+                                </form>
+                                <a href="{{route('note.show')}}" type="button" class="mt-3 w-full inline-flex justify-center rounded-md border border-gray-300 px-4 py-2 bg-white text-base font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 sm:mt-0 sm:ml-3 sm:w-auto sm:text-sm">Cancel</a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+
+
+            </main>
+        </div>
+    </div>
+</x-app-layout>