Initial commit

resources/views/livewire/profile/socials-form-create.blade.php

@@ -0,0 +1,49 @@
+@php
+    $social = App\Models\Social::find($socialsOptionSelected);
+    $needsServer = $social && Str::contains($social->url_structure, '#');
+    $canEnable = $social && $userOnSocial && (!$needsServer || $serverOfSocial);
+@endphp
+
+<form>
+    <div class="grid col-span3 sm:col-span-3 mt-3">
+        <x-select id="create"
+            placeholder="{{ __('Select social media') }}"
+            wire:model.live="socialsOptionSelected"
+            class="placeholder-gray-300"
+            >
+            @foreach ($socialsOptions as $option)
+                <x-select.option src="{{ Storage::url($option->icon) }}" label="{{ $option->name}}" value="{{ $option->id }}" />
+            @endforeach
+        </x-select>
+    </div>
+
+    <div class="grid col-span3 sm:col-span-3 my-2">
+        @if(App\Models\Social::find($socialsOptionSelected))
+            @if(App\Models\Social::find($socialsOptionSelected)->url_structure === '')
+            <x-jetstream.input wire:model.live="userOnSocial" label="{{ __('Link to your page on social media') }}" placeholder="{{ __('Link or URL address') }}" prefix=" " class="placeholder-gray-300"/>
+            @else
+                <x-jetstream.input wire:model.live="userOnSocial" label="{{ __('Your username on social media') }}" placeholder="{{ __('account-name') }}" prefix="@ " class="placeholder-gray-300 my-2"/>
+            @if(Str::contains(App\Models\Social::find($socialsOptionSelected)->url_structure, '#'))
+                <x-jetstream.input wire:model.live="serverOfSocial" label="{{ __('Server of social media') }}" placeholder="{{ __('server-name.org') }}" prefix="@ " class="placeholder-gray-300"/>
+            @endif
+            @endif
+
+        @endif
+    </div>
+
+   <button
+        wire:click.prevent="store()"
+        class="inline-flex items-center px-4 py-2 bg-gray-100 border border-theme-border rounded-md font-semibold text-xs text-theme-primary uppercase tracking-widest shadow-sm hover:bg-gray-200 hover:text-theme-secondary focus:outline-none focus:border-theme-accent focus:ring-1 focus:ring-theme-accent active:text-theme-primary active:bg-gray-50 disabled:opacity-25 transition"
+        @disabled(!$canEnable)
+    >
+        {{ __('Add social media') }}
+    </button>
+        @if (session()->has('message'))
+        <span x-data="{show: true}" x-init="setTimeout(() => show = false, 2000)" x-show="show" x-transition:leave.opacity.duration.1500ms>
+            <span class="ml-3 text-sm text-theme-secondary">
+                {{ session('message') }}
+            </span>
+        </span>
+        @endif
+
+</form>