More work on moving service updates to use components, move 'host' to 'hosting', move some redundant views

resources/views/theme/backend/adminlte/service/widget/hosting/details.blade.php

@@ -0,0 +1,57 @@
+<!-- $o = App\Models\Service\Host::class -->
+<div class="card">
+	@if($o->service->isPending())
+		<div class="ribbon-wrapper ribbon-lg">
+			<div class="ribbon bg-warning">
+				Pending
+			</div>
+		</div>
+	@endif
+
+	<div class="card-header bg-gray-dark">
+		<h3 class="card-title">Hosting Details</h3>
+	</div>
+
+	<div class="card-body bg-gray-dark">
+		<table class="table table-sm">
+			<tr>
+				<th>Domain Name</th>
+				<td>{{ $o->service->name }}</td>
+			</tr>
+			@if($o->provider->whitelabel_url)
+				<tr>
+					<th>Hosting URL</th>
+					<td><a href="{{ $o->provider->whitelabel_url }}" target="_blank" class="text-white">{{ $o->provider->whitelabel_url }}</a></td>
+				</tr>
+				<tr>
+					<th>Hosting Username</th>
+					<td>{{ $o->host_username }}</td>
+				</tr>
+				<tr>
+					<th>Hosting Password</th>
+					<td>{{ $o->host_password }}</td>
+				</tr>
+			@endif
+			@if($o->service_connect_date)
+				<tr>
+					<th>Connected</th>
+					<td>{{ $o->service_connect_date->format('Y-m-d') }}</td>
+				</tr>
+			@endif
+			@if ($o->inContract())
+				<tr>
+					<th>Contract Term</th>
+					<td>{{ $o->service->contract_term }} months</td>
+				</tr>
+				<tr>
+					<th>Contract End</th>
+					<td>{{ $o->service->contract_end->format('Y-m-d') }} <small>({{ $o->service->contract_end->diffForHumans() }})</small></td>
+				</tr>
+			@endif
+			<tr>
+				<th>Cancel Notice</th>
+				<td>Before renewal</td>
+			</tr>
+		</table>
+	</div>
+</div>

resources/views/theme/backend/adminlte/service/widget/hosting/update.blade.php

@@ -0,0 +1,44 @@
+@use(App\Models\SupplierHostServer)
+
+<!-- o=Service\Host::class -->
+<div class="row">
+	<div class="col-12 col-sm-9 col-md-12 col-xl-7">
+		<x-form.domain name="hosting" label="Domain Name" :name_value="$o->domain_name" :tld_value="$o->tld_id"/>
+	</div>
+
+	<div class="col-12 col-sm-9 col-md-6 col-xl-5">
+		<x-leenooks::form.date id="expire_at" name="hosting[expire_at]" icon="fa-calendar" label="Expiry" old="hosting.expire_at" :value="($o->expire_at ?: $o->connect_at?->addMonths($o->contract_term))?->format('Y-m-d')"/>
+	</div>
+</div>
+
+<hr>
+<p class="h6">Hosting Details</p>
+
+<div class="row">
+	<div class="col-12 col-sm-9 col-md-6 col-xl-5">
+		<x-leenooks::form.select id="supplier_host_server_id" name="hosting[supplier_host_server_id]" icon="fa-handshake" label="Registrar" :value="$o->supplier_host_server_id" :options="SupplierHostServer::active()->orderBy('name')->get()->transform(fn($item)=>['id'=>$item->id,'value'=>$item->name])"/>
+	</div>
+</div>
+
+<div class="row">
+	<div class="col-12 col-sm-9 col-md-12 col-xl-7">
+		<x-leenooks::form.text id="host_username" name="hosting[host_username]" icon="fa-user" label="Admin Username" :value="$o->host_username"/>
+	</div>
+
+	<div class="col-12 col-sm-9 col-md-5 col-xl-5">
+		<x-leenooks::form.text id="host_password" name="hosting[host_password]" icon="fa-lock" label="Admin Password" :value="$o->host_password"/>
+	</div>
+</div>
+
+@pa(select2,autofocus)
+
+@section('page-scripts')
+	<script type="text/javascript">
+		$(document).ready(function() {
+			$('#tld_id').select2({
+				dropdownAutoWidth: true,
+				width: 'style',
+			});
+		});
+	</script>
+@append