Untitled
unknown
php_laravel_blade
2 years ago
16 kB
5
Indexable
<div class="flex-1 flex flex-col overflow-hidden gap-4">
<div class="flex-shrink-0 flex items-center gap-4">
<div class="w-48">
<x:custom-multiselect
selected="selected"
items="options"
:set-value-on-close="true"
>
<x:slot name="trigger">
<div class="flex items-center space-x-2">
<span
:class="{ 'text-gray-500' : selected.length == 0 }">
Comment
</span>
</div>
</x:slot>
<x:slot name="item">
<span class="mr-2 truncate" x-text="item.name"></span>
</x:slot>
</x:custom-multiselect>
</div>
<div class="w-48">
<x:form.custom-select
wire:model="sortBy"
:options="$this->sortOptions"
placeholder="Sort by"
/>
</div>
</div>
<div class="h-full flex-1 overflow-auto space-y-2">
@foreach($comments as $item)
<div wire:key="{{\Illuminate\Support\Str::random()}}">
<div class="relative {{$loop->last ?: ' mb-4'}}">
<div wire:key="{{ \Illuminate\Support\Str::random() }}"
id="{{$item['type'] . '-'. $item['id']}}" class="relative flex items-start
space-x-3">
<div class="relative">
<img src="{{ $item['user_image'] }}"
class="h-9 w-9 object-cover rounded-full bg-gray-400 flex items-center justify-center ring-8 ring-gray-100"
alt="img">
</div>
<div class="bg-white rounded-md min-w-0 flex-1 p-3 hover:bg-gray-50 cursor-pointer">
<div class="items-center"
wire:click="$emit('updateActiveLinkIndex','{{$item['link_id']}}','{{$item['timestamp']}}')">
<div class="flex text-sm font-semibold text-gray-900">
<span>{{ $item['user_name'] ?? '' }}</span>
</div>
<div title="{{ $item['created_at'] }}"
class="flex text-xs text-gray-400 min-w-0 ">
{{ $item['created_at_diff_for_humans'] }}
@if($item['link_key'])
<div
class="ml-1">
at
{{ format_seconds($item['timestamp']) ?? '00:00' }} at Link {{ $item['link_key'] }}
</div>
@endif
</div>
</div>
<div>
<div class="mt-1 text-sm text-gray-500 font-normal "
wire:click="$emit('updateActiveLinkIndex','{{$item['link_id']}}','{{$item['timestamp']}}')">
<p>
{!! $item['rich_text'] !!}
</p>
</div>
<div class="flex">
@if(!$item['parent_id'])
<div class="flex mt-1 text-xs text-primary-400">
<button
wire:click="$emit('replyComment', '{{ $item['id'] }}', '{{ $item['type'] }}')"
class="focus:outline-none outline-none items-center">
Reply
</button>
</div>
@endif
@if(auth()->id() == $item['user_id'])
<div class="flex mt-1 text-xs text-primary-400 ml-auto">
<div x-data="{'open' : false}">
<div class="relative inline-block">
<button x-on:click="open = true"
class="focus:outline-none outline-none items-center">
Delete
</button>
<div x-show.transition="open"
x-on:click.away="open=false"
class="bg-white absolute origin-top-left right-0 mt-2 w-48 items-center rounded-md z-10">
<div
class="rounded-md bg-white shadow-xs m-3">
<div role="menu"
aria-orientation="vertical"
aria-labelledby="options-menu">
<ul class="items-center">
<li>
<button
x-on:click="open = false"
wire:click="deleteComment('{{ $item['id']}}','{{$item['type']}}')"
class="focus:outline-none outline-none items-center">
Confirm deletion
</button>
</li>
</ul>
<svg
class="absolute text-white shadow-lg h-2.5 mr-3 bottom-full"
x="0px"
y="0px"
viewBox="0 0 255 255"
xml:space="preserve"
transform="rotate(180)">
<polygon class="fill-current"
points="0,0,127.5,255 255,0"/></svg>
</div>
</div>
</div>
</div>
</div>
</div>
@endif
</div>
</div>
</div>
</div>
<div>
@foreach($item['replies'] as $item)
<div wire:key="{{ \Illuminate\Support\Str::random() }}"
class="relative {{ $loop->last ?: ' mb-4' }} {{ $loop->first ? ' mt-4' :'' }}">
<div class="ml-8">
<div wire:key="{{ \Illuminate\Support\Str::random() }}"
id="{{$item['type'] . '-'. $item['id']}}" class="relative flex items-start
space-x-3">
<div class="relative">
<img src="{{ $item['user_image'] }}"
class="h-9 w-9 object-cover rounded-full bg-gray-400 flex items-center justify-center ring-8 ring-gray-100"
alt="img">
</div>
<div class="bg-white rounded-md min-w-0 flex-1 p-3">
<div class="items-center">
<div class="flex text-sm font-semibold text-gray-900">
<span>{{ $item['user_name'] ?? '' }}</span>
</div>
<div title="{{ $item['created_at'] }}"
class="flex text-xs text-gray-400 min-w-0 ">
{{ $item['created_at_diff_for_humans'] }}
@if($item['link_key'])
<div
class="cursor-pointer ml-1"
wire:click="$emit('updateActiveLinkIndex','{{$item['link_id']}}','{{$item['timestamp']}}')">
at Link {{ $item['link_key'] }}
</div>
@endif
</div>
</div>
<div>
<div class="mt-1 text-sm text-gray-500 font-normal">
<p>
{!! $item['rich_text'] !!}
</p>
</div>
<div class="flex">
@if(!$item['parent_id'])
<div class="flex mt-1 text-xs text-primary-400">
<button
wire:click="$emit('replyComment', '{{ $item['id'] }}', '{{ $item['type'] }}')"
class="focus:outline-none outline-none items-center">
Reply
</button>
</div>
@endif
@if(auth()->id() == $item['user_id'])
<div class="flex mt-1 text-xs text-primary-400 ml-auto">
<div x-data="{'open' : false}">
<div class="relative inline-block">
<button x-on:click="open = true"
class="focus:outline-none outline-none items-center">
Delete
</button>
<div x-show.transition="open"
x-on:click.away="open=false"
class="bg-white absolute origin-top-left right-0 mt-2 w-48 items-center rounded-md z-10">
<div
class="rounded-md bg-white shadow-xs m-3">
<div role="menu"
aria-orientation="vertical"
aria-labelledby="options-menu">
<ul class="items-center">
<li>
<button
x-on:click="open = false"
wire:click="deleteComment('{{ $item['id']}}','{{$item['type']}}')"
class="focus:outline-none outline-none items-center">
Confirm deletion
</button>
</li>
</ul>
<svg
class="absolute text-white shadow-lg h-2.5 mr-3 bottom-full"
x="0px"
y="0px"
viewBox="0 0 255 255"
xml:space="preserve"
transform="rotate(180)">
<polygon class="fill-current"
points="0,0,127.5,255 255,0"/></svg>
</div>
</div>
</div>
</div>
</div>
</div>
@endif
</div>
</div>
</div>
</div>
</div>
</div>
@endforeach
</div>
</div>
</div>
@endforeach
</div>
</div>Editor is loading...