From 63232b33a66edb2dec5abc5ca397b69ed906025d Mon Sep 17 00:00:00 2001
From: Eric Wang <eric.wang401@gmail.com>
Date: Mon, 2 Jan 2023 03:41:28 +0000
Subject: [PATCH] show only available ips

---
 .../Admin/Nodes/AddressController.php            |  3 ++-
 app/Models/Filters/AllowedNullableFilter.php     | 16 ++++++++++++++++
 .../api/admin/nodes/addresses/getAddresses.ts    |  4 +++-
 .../admin/servers/AddressesMultiSelectFormik.tsx |  8 +++++---
 .../admin/servers/CreateServerModal.tsx          |  2 +-
 5 files changed, 27 insertions(+), 6 deletions(-)
 create mode 100644 app/Models/Filters/AllowedNullableFilter.php

diff --git a/app/Http/Controllers/Admin/Nodes/AddressController.php b/app/Http/Controllers/Admin/Nodes/AddressController.php
index 63e09b53..43cbc7ec 100644
--- a/app/Http/Controllers/Admin/Nodes/AddressController.php
+++ b/app/Http/Controllers/Admin/Nodes/AddressController.php
@@ -5,6 +5,7 @@ namespace Convoy\Http\Controllers\Admin\Nodes;
 use Convoy\Http\Controllers\Controller;
 use Convoy\Http\Requests\Admin\Nodes\Addresses\StoreAddressRequest;
 use Convoy\Http\Requests\Admin\Nodes\Addresses\UpdateAddressRequest;
+use Convoy\Models\Filters\AllowedNullableFilter;
 use Convoy\Models\Filters\FiltersAddress;
 use Convoy\Models\IPAddress;
 use Convoy\Models\Node;
@@ -25,7 +26,7 @@ class AddressController extends Controller
         $addresses = QueryBuilder::for(IPAddress::query())
             ->with('server')
             ->where('ip_addresses.node_id', $node->id)
-            ->allowedFilters(['address', AllowedFilter::exact('type'), AllowedFilter::custom('*', new FiltersAddress)])
+            ->allowedFilters(['address', AllowedFilter::exact('type'), AllowedFilter::custom('*', new FiltersAddress), AllowedNullableFilter::exact('server_id')])
             ->paginate(min($request->query('per_page', 50), 100))->appends($request->query());
 
         return fractal($addresses, new AddressTransformer)->parseIncludes($request->includes)->respond();
diff --git a/app/Models/Filters/AllowedNullableFilter.php b/app/Models/Filters/AllowedNullableFilter.php
new file mode 100644
index 00000000..7b7a8329
--- /dev/null
+++ b/app/Models/Filters/AllowedNullableFilter.php
@@ -0,0 +1,16 @@
+<?php
+
+namespace Convoy\Models\Filters;
+
+use Spatie\QueryBuilder\AllowedFilter;
+use Spatie\QueryBuilder\QueryBuilder;
+
+class AllowedNullableFilter extends AllowedFilter
+{
+    public function filter(QueryBuilder $query, $value): void
+    {
+        $valueToFilter = $this->resolveValueForFiltering($value);
+
+        ($this->filterClass)($query->getEloquentBuilder(), $valueToFilter, $this->internalName);
+    }
+}
diff --git a/resources/scripts/api/admin/nodes/addresses/getAddresses.ts b/resources/scripts/api/admin/nodes/addresses/getAddresses.ts
index 5d6e5911..dc34ab17 100644
--- a/resources/scripts/api/admin/nodes/addresses/getAddresses.ts
+++ b/resources/scripts/api/admin/nodes/addresses/getAddresses.ts
@@ -6,6 +6,7 @@ export type AddressIncludes = 'server'
 export type AddressResponse = PaginatedResult<Address>
 
 export interface QueryParams {
+    serverId?: number | null
     type?: AddressType
     address?: string
     query?: string
@@ -16,10 +17,11 @@ export interface QueryParams {
 
 const getAddresses = async (
     nodeId: number,
-    { type, address, query, perPage = 50, includes, ...params }: QueryParams
+    { serverId, type, address, query, perPage = 50, includes, ...params }: QueryParams
 ): Promise<AddressResponse> => {
     const { data } = await http.get(`/api/admin/nodes/${nodeId}/addresses`, {
         params: {
+            'filter[server_id]': serverId === null ? '' : serverId,
             'filter[type]': type,
             'filter[address]': address,
             'filter[*]': query,
diff --git a/resources/scripts/components/admin/servers/AddressesMultiSelectFormik.tsx b/resources/scripts/components/admin/servers/AddressesMultiSelectFormik.tsx
index 174d9e64..acd614a4 100644
--- a/resources/scripts/components/admin/servers/AddressesMultiSelectFormik.tsx
+++ b/resources/scripts/components/admin/servers/AddressesMultiSelectFormik.tsx
@@ -15,18 +15,20 @@ const AddressesMultiSelectFormik = ({ disabled }: Props) => {
     const [{ value: nodeId }] = useField('nodeId')
 
     const [query, setQuery] = useState('')
-    const { data, mutate, isValidating, isLoading } = useAddressesSWR(nodeId ?? -1, { query })
+    const { data, mutate, isValidating, isLoading } = useAddressesSWR(nodeId ?? -1, { query, serverId: null })
     const { data: selectedAddresses } = useAddressesSWR(nodeId ?? -1, {
         query: ((addressIds as number[]).length > 0 ? (addressIds as number[]) : [-1]).join(','),
         id: 'selected-addresses',
     })
 
+    console.log({ data, selectedAddresses })
+
     const addresses = useMemo(() => {
         const available =
             data && selectedAddresses
                 ? data.items
                       .filter(address => {
-                          return !selectedAddresses.items.find(selected => selected.id === address.id)
+                          return !selectedAddresses.items.find(selectedAddress => selectedAddress.id === address.id)
                       })
                       .map(address => ({
                           value: address.id.toString(),
@@ -42,7 +44,7 @@ const AddressesMultiSelectFormik = ({ disabled }: Props) => {
             : []
 
         return [...selected, ...available]
-    }, [data])
+    }, [data, selectedAddresses])
 
     const search = useCallback(
         debounce(() => {
diff --git a/resources/scripts/components/admin/servers/CreateServerModal.tsx b/resources/scripts/components/admin/servers/CreateServerModal.tsx
index abea2bcb..a5723b3a 100644
--- a/resources/scripts/components/admin/servers/CreateServerModal.tsx
+++ b/resources/scripts/components/admin/servers/CreateServerModal.tsx
@@ -98,7 +98,7 @@ const CreateServerModal = ({ nodeId, open, onClose }: Props) => {
                             />
                         </div>
                         <CheckboxFormik name={'createServer'} label={'Create Server'} className={'mt-3'} />
-                        <TemplatesSelectFormik disabled={!form.values.createServer} />
+                        <TemplatesSelectFormik disabled={!form.values.createServer || form.values.nodeId === ''} />
                         <CheckboxFormik
                             name={'startAfterCompletion'}
                             label={'Start Server After Completion'}