adding

app/Http/Controllers/BucketController.php

@@ -11,12 +11,19 @@ class BucketController extends BaseController
 {
     use AuthorizesRequests, DispatchesJobs, ValidatesRequests;
 
-    public function get()
+    /**
+     *
+     *
+     *  @return
+     *
+     */
+    public function single()
     {
-        
+        return view('bucket.single');
     }
 
     /**
+     *
      *
      *  @return [type] [description]
      *
@@ -26,16 +33,25 @@ class BucketController extends BaseController
         return view('bucket.create');
     }
 
+    /**
+     *
+     *
+     */
     public function store()
     {
         $validated = request()->validate([
-            'title' => 'required|max:255',
+            'name' => 'required|max:255',
+            'description' => 'max:255',
+            'path' => 'present',
             'is_public' => 'boolean',
         ]);
 
         if ($validated) {
+
+            $bucket = Bucket::create($validated);
+
             return redirect()
-                ->route('bucket.get', ['uuid' => 12]);
+                ->route('bucket.single', ['uuid' => 12]);
         } else {
             return back()
                 ->withInput();

app/Models/Bucket.php

@@ -0,0 +1,19 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class Bucket extends Model
+{
+    /**
+     * The attributes that are mass assignable.
+     *
+     * @var array
+     */
+    protected $fillable = [
+        'name',
+        'description',
+        'path',
+    ];
+}

database/migrations/2020_11_20_113852_create_hubs_table.php → database/migrations/2020_11_20_113852_create_buckets_table.php

@@ -4,7 +4,7 @@ use Illuminate\Database\Migrations\Migration;
 use Illuminate\Database\Schema\Blueprint;
 use Illuminate\Support\Facades\Schema;
 
-class CreateHubsTable extends Migration
+class CreateBucketsTable extends Migration
 {
     /**
      * Run the migrations.
@@ -13,7 +13,7 @@ class CreateHubsTable extends Migration
      */
     public function up()
     {
-        Schema::create('hubs', function (Blueprint $table) {
+        Schema::create('buckets', function (Blueprint $table) {
             $table->uuid('id')->primary();
 
             $table->string('name');
@@ -31,6 +31,6 @@ class CreateHubsTable extends Migration
      */
     public function down()
     {
-        Schema::dropIfExists('hubs');
+        Schema::dropIfExists('buckets');
     }
 }

resources/js/components/bucket/form.riot

@@ -4,18 +4,55 @@
 
             <input type="hidden" name="_token" value={ state.csrfToken } if={ state.csrfToken } />
 
-            <!-- title -->
+            <!-- name -->
             <div class="field is-horizontal">
                 <div class="field-label is-normal">
-                    <label class="label" for="title">
-                        title
+                    <label class="label required" for="name">
+                        name
                     </label>
                 </div>
                 <div class="field-body">
                     <div class="field">
                         <p class="control">
-                            <input id="title" class={ getClasses('title', 'input') } type="text" name="title" value={ props.title } onkeyup={ (event) => { state.validator.handle(event, 'title') }} />
-                            <field-error errors={ state.validator.errors('title') } ></field-error>
+                            <input id="name" class={ getClasses('name', 'input') } type="text" name="name" value={ props.name } onkeyup={ (event) => { state.validator.handle(event, 'name') }} />
+                            <field-error errors={ state.validator.errors('name') } ></field-error>
+                        </p>
+                    </div>
+                </div>
+            </div>
+
+            <!-- description -->
+            <div class="field is-horizontal">
+                <div class="field-label is-normal">
+                    <label class="label" for="description">
+                        description
+                    </label>
+                </div>
+                <div class="field-body">
+                    <div class="field">
+                        <p class="control">
+                            <textarea id="description" class={ getClasses('description', 'textarea') } name="description" value={ props.description } onkeyup={ (event) => { state.validator.handle(event, 'description') }}></textarea>
+                            <field-error errors={ state.validator.errors('description') } ></field-error>
+                        </p>
+                    </div>
+                </div>
+            </div>
+
+            <!-- path -->
+            <div class="field is-horizontal">
+                <div class="field-label is-normal">
+                    <label class="label" for="name">
+                        path
+                    </label>
+                </div>
+                <div class="field-body">
+                    <div class="field">
+                        <p class="control">
+                            <input id="path" class={ getClasses('path', 'input') } type="text" name="path" value={ props.path } onkeyup={ (event) => { state.validator.handle(event, 'path') }} />
+                            <field-error errors={ state.validator.errors('path') } ></field-error>
+                            <span class="help">
+                                path for storage files, if empty default path will be used
+                            </span>
                         </p>
                     </div>
                 </div>
@@ -31,6 +68,9 @@
                 <div class="field-body">
                     <div class="field">
                         <input id="public" type="checkbox" name="public" value="1" checked={ props.public }>
+                        <span class="help">
+                            everyone can see bucket, files and download them
+                        </span>
                     </div>
                 </div>
             </div>
@@ -69,8 +109,16 @@
          */
         onBeforeMount(props, state) {
             state.validator = new Validator({
-                title: {
-                    presence: true
+                name: {
+                    presence: true,
+                    length: {
+                        maximum: 255
+                    }
+                },
+                description: {
+                    length: {
+                        maximum: 255
+                    }
                 }
             }, this)
 

resources/scss/bootstrap.scss

@@ -60,5 +60,13 @@ input[type=checkbox] {
     top: 0.7em;
 }
 
+label.required {
+    &:after {
+        content: "\2731";
+        vertical-align: top;
+        font-size: 80%;
+    }
+}
+
 @include component__accordion();
 @include component__buckets();

resources/views/bucket/single.blade.php

@@ -0,0 +1,21 @@
+@extends('layout')
+
+@section('head')
+    <meta name="csrf-token" content="{{ csrf_token() }}">
+@endsection
+
+@section('main')
+<div class="container is-fluid">
+    <h1 class="title is-3 is-spaced">
+        Create Bucket
+    </h1>
+    <urban-bucket-form></urban-bucket-form>
+</div>
+
+@push('scripts')
+    <script type="text/javascript" src="/js/bucket.js"></script>
+    <script type="text/javascript" defer>
+        riot.mount('urban-bucket-form', {!! json_encode(old()) !!});
+    </script>
+@endpush
+@endsection

routes/web.php

@@ -13,13 +13,16 @@ use Illuminate\Support\Facades\Route;
 |
 */
 
+//  pattern
+Route::pattern('uuid', '[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}');
+
+// routes
 Route::get('/', 'App\Http\Controllers\HomeController@show');
 
 Route::prefix('bucket')->group(function() {
-    Route::get('create', 'App\Http\Controllers\BucketController@create');
+    Route::get('create', 'App\Http\Controllers\BucketController@create')->name('bucket.create');
     Route::post('create', 'App\Http\Controllers\BucketController@store');
-    
-    Route::get('{uuid}', 'App\Http\Controllers\BucketController@get')->name('bucket.get');
+    Route::get('{uuid}', 'App\Http\Controllers\BucketController@single')->name('bucket.single');
 });
 
 /***