Skip to content

Commit 3f8324d

Browse files
andrasbacsaiandrasbacsai
committed
chore: Refactor loadServices2 method and remove unused code
1 parent eee292b commit 3f8324d

File tree

2 files changed

+102
-137
lines changed

2 files changed

+102
-137
lines changed

‎app/Livewire/Project/New/Select.php‎

Lines changed: 2 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -49,11 +49,8 @@ class Select extends Component
4949

5050
public ?string $existingPostgresqlUrl = null;
5151

52-
public ?string $search = null;
53-
5452
protected $queryString = [
5553
'server_id',
56-
'search',
5754
];
5855

5956
public function mount()
@@ -90,13 +87,13 @@ public function updatedSelectedEnvironment()
9087
// }
9188
// }
9289

93-
public function loadServices2()
90+
public function loadServices()
9491
{
9592
$services = get_service_templates(true);
9693
$services = collect($services)->map(function ($service, $key) {
9794
return [
9895
'name' => str($key)->headline(),
99-
'logo' => asset(data_get($service, 'logo', 'svgs/unknown.svg')),
96+
'logo' => asset(data_get($service, 'logo', 'svgs/coolify.png')),
10097
] + (array) $service;
10198
})->all();
10299
$gitBasedApplications = [
@@ -205,42 +202,6 @@ public function loadServices2()
205202
];
206203
}
207204

208-
public function updatedSearch()
209-
{
210-
$this->loadServices();
211-
}
212-
213-
public function loadServices(bool $force = false)
214-
{
215-
try {
216-
$this->loadingServices = true;
217-
if (count($this->allServices) > 0 && ! $force) {
218-
if (! $this->search) {
219-
$this->services = $this->allServices;
220-
221-
return;
222-
}
223-
$this->services = $this->allServices->filter(function ($service, $key) {
224-
$tags = collect(data_get($service, 'tags', []));
225-
226-
return str_contains(strtolower($key), strtolower($this->search)) || $tags->contains(function ($tag) {
227-
return str_contains(strtolower($tag), strtolower($this->search));
228-
});
229-
});
230-
} else {
231-
$this->search = null;
232-
$this->allServices = get_service_templates($force);
233-
$this->services = $this->allServices->filter(function ($service, $key) {
234-
return str_contains(strtolower($key), strtolower($this->search));
235-
});
236-
}
237-
} catch (\Throwable $e) {
238-
return handleError($e, $this);
239-
} finally {
240-
$this->loadingServices = false;
241-
}
242-
}
243-
244205
public function instantSave()
245206
{
246207
if ($this->includeSwarm) {

‎resources/views/livewire/project/new/select.blade.php‎

Lines changed: 100 additions & 96 deletions
Original file line numberDiff line numberDiff line change
@@ -10,116 +10,120 @@
1010
</div>
1111
</div>
1212
<div class="pb-4">Deploy resources, like Applications, Databases, Services...</div>
13-
<div class="flex flex-col gap-4 py-4" x-data="searchResources()">
13+
<div x-data="searchResources()">
1414
@if ($current_step === 'type')
1515
<div class="sticky top-0 z-50 py-2">
1616
<input autocomplete="off" x-ref="searchInput" class="input w-full" x-model="search"
1717
placeholder="Type / to search..." @keydown.window.slash.prevent="$refs.searchInput.focus()">
1818
</div>
1919
<div x-show="loading">Loading...</div>
20-
<h2 x-show="filteredGitBasedApplications.length > 0">Applications</h2>
21-
<h4 x-show="filteredGitBasedApplications.length > 0">Git Based</h4>
22-
<div x-show="filteredGitBasedApplications.length > 0"
23-
class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-1">
24-
<template x-for="application in filteredGitBasedApplications" :key="application.name">
25-
<div x-on:click='setType(application.id)'>
26-
<x-resource-view>
27-
<x-slot:title><span x-text="application.name"></span></x-slot>
28-
<x-slot:description>
29-
<span x-html="application.description"></span>
30-
</x-slot>
31-
<x-slot:logo>
32-
<img class="w-[4.5rem]
33-
aspect-square h-[4.5rem] p-2 transition-all duration-200 opacity-30 grayscale group-hover:grayscale-0 group-hover:opacity-100 "
34-
:src="application.logo">
35-
</x-slot:logo>
36-
</x-resource-view>
37-
</div>
38-
</template>
39-
</div>
40-
<h4 x-show="filteredDockerBasedApplications.length > 0">Docker Based</h4>
41-
<div x-show="filteredDockerBasedApplications.length > 0"
42-
class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-3">
43-
<template x-for="application in filteredDockerBasedApplications" :key="application.name">
44-
<div x-on:click="setType(application.id)">
45-
<x-resource-view>
46-
<x-slot:title><span x-text="application.name"></span></x-slot>
47-
<x-slot:description><span x-text="application.description"></span></x-slot>
48-
<x-slot:logo> <img
49-
class="w-[4.5rem]
50-
aspect-square h-[4.5rem] p-2 transition-all duration-200 opacity-30 grayscale group-hover:grayscale-0 group-hover:opacity-100 "
51-
:src="application.logo"></x-slot>
52-
</x-resource-view>
53-
</div>
54-
</template>
55-
</div>
56-
<h2 x-show="filteredDatabases.length > 0">Databases</h2>
57-
<div x-show="filteredDatabases.length > 0"
58-
class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-2">
59-
<template x-for="database in filteredDatabases" :key="database.id">
60-
<div x-on:click="setType(database.id)">
61-
<x-resource-view>
62-
<x-slot:title><span x-text="database.name"></span></x-slot>
63-
<x-slot:description><span x-text="database.description"></span></x-slot>
64-
<x-slot:logo>
65-
<span x-show="database.logo">
66-
<span x-html="database.logo"></span>
67-
</span>
68-
</x-slot>
69-
</x-resource-view>
70-
</div>
71-
</template>
72-
</div>
73-
<div x-show="filteredServices.length > 0">
74-
<div class="flex items-center gap-4" x-init="loadResources">
75-
<h2>Services</h2>
76-
<x-forms.button x-on:click="loadResources">Reload List</x-forms.button>
77-
</div>
78-
<div class="pb-4 text-xs">Trademarks Policy: The respective trademarks mentioned here are owned by the
79-
respective
80-
companies, and use of them does not imply any affiliation or endorsement.<br>Find more services <a
81-
class="dark:text-white underline" target="_blank"
82-
href="https://coolify.io/docs/services">here</a>.</div>
83-
84-
<div class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-2">
85-
<template x-for="service in filteredServices" :key="service.name">
86-
<div x-on:click="setType('one-click-service-' + service.name)">
20+
<div x-show="!loading" class="flex flex-col gap-4 py-4">
21+
<h2 x-show="filteredGitBasedApplications.length > 0">Applications</h2>
22+
<h4 x-show="filteredGitBasedApplications.length > 0">Git Based</h4>
23+
<div x-show="filteredGitBasedApplications.length > 0"
24+
class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-1">
25+
<template x-for="application in filteredGitBasedApplications" :key="application.name">
26+
<div x-on:click='setType(application.id)'>
8727
<x-resource-view>
88-
<x-slot:title>
89-
<template x-if="service.name">
90-
<span x-text="service.name"></span>
91-
</template>
92-
</x-slot>
28+
<x-slot:title><span x-text="application.name"></span></x-slot>
9329
<x-slot:description>
94-
<template x-if="service.slogan">
95-
<span x-text="service.slogan"></span>
96-
</template>
30+
<span x-html="application.description"></span>
9731
</x-slot>
9832
<x-slot:logo>
99-
<template x-if="service.logo">
100-
<img class="w-[4.5rem] aspect-square h-[4.5rem] p-2 transition-all duration-200 opacity-30 grayscale group-hover:grayscale-0 group-hover:opacity-100"
101-
:src='service.logo'>
102-
</template>
33+
<img class="w-[4.5rem]
34+
aspect-square h-[4.5rem] p-2 transition-all duration-200 opacity-30 grayscale group-hover:grayscale-0 group-hover:opacity-100 "
35+
:src="application.logo">
10336
</x-slot:logo>
104-
<x-slot:documentation>
105-
<template x-if="service.documentation">
106-
<div class="flex items-center px-2" title="Read the documentation.">
107-
<a class="p-2 rounded hover:bg-coolgray-200 hover:no-underline group-hover:dark:text-white text-neutral-600"
108-
onclick="event.stopPropagation()" :href="service.documentation"
109-
target="_blank">
110-
Docs
111-
</a>
112-
</div>
113-
</template>
114-
</x-slot:documentation>
11537
</x-resource-view>
11638
</div>
11739
</template>
11840
</div>
119-
</div>
120-
<div
121-
x-show="filteredGitBasedApplications.length === 0 && filteredDockerBasedApplications.length === 0 && filteredDatabases.length === 0 && filteredServices.length === 0 && loading === false">
122-
<div>No resources found.</div>
41+
<h4 x-show="filteredDockerBasedApplications.length > 0">Docker Based</h4>
42+
<div x-show="filteredDockerBasedApplications.length > 0"
43+
class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-3">
44+
<template x-for="application in filteredDockerBasedApplications" :key="application.name">
45+
<div x-on:click="setType(application.id)">
46+
<x-resource-view>
47+
<x-slot:title><span x-text="application.name"></span></x-slot>
48+
<x-slot:description><span x-text="application.description"></span></x-slot>
49+
<x-slot:logo> <img
50+
class="w-[4.5rem]
51+
aspect-square h-[4.5rem] p-2 transition-all duration-200 opacity-30 grayscale group-hover:grayscale-0 group-hover:opacity-100 "
52+
:src="application.logo"></x-slot>
53+
</x-resource-view>
54+
</div>
55+
</template>
56+
</div>
57+
<h2 x-show="filteredDatabases.length > 0">Databases</h2>
58+
<div x-show="filteredDatabases.length > 0"
59+
class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-2">
60+
<template x-for="database in filteredDatabases" :key="database.id">
61+
<div x-on:click="setType(database.id)">
62+
<x-resource-view>
63+
<x-slot:title><span x-text="database.name"></span></x-slot>
64+
<x-slot:description><span x-text="database.description"></span></x-slot>
65+
<x-slot:logo>
66+
<span x-show="database.logo">
67+
<span x-html="database.logo"></span>
68+
</span>
69+
</x-slot>
70+
</x-resource-view>
71+
</div>
72+
</template>
73+
</div>
74+
<div x-show="filteredServices.length > 0">
75+
<div class="flex items-center gap-4" x-init="loadResources">
76+
<h2>Services</h2>
77+
<x-forms.button x-on:click="loadResources">Reload List</x-forms.button>
78+
</div>
79+
<div class="pb-4 text-xs">Trademarks Policy: The respective trademarks mentioned here are owned by
80+
the
81+
respective
82+
companies, and use of them does not imply any affiliation or endorsement.<br>Find more services
83+
<a class="dark:text-white underline" target="_blank"
84+
href="https://coolify.io/docs/services">here</a>.
85+
</div>
86+
87+
<div class="grid justify-start grid-cols-1 gap-4 text-left xl:grid-cols-2">
88+
<template x-for="service in filteredServices" :key="service.name">
89+
<div x-on:click="setType('one-click-service-' + service.name)">
90+
<x-resource-view>
91+
<x-slot:title>
92+
<template x-if="service.name">
93+
<span x-text="service.name"></span>
94+
</template>
95+
</x-slot>
96+
<x-slot:description>
97+
<template x-if="service.slogan">
98+
<span x-text="service.slogan"></span>
99+
</template>
100+
</x-slot>
101+
<x-slot:logo>
102+
<template x-if="service.logo">
103+
<img class="w-[4.5rem] aspect-square h-[4.5rem] p-2 transition-all duration-200 opacity-30 grayscale group-hover:grayscale-0 group-hover:opacity-100"
104+
:src='service.logo'>
105+
</template>
106+
</x-slot:logo>
107+
<x-slot:documentation>
108+
<template x-if="service.documentation">
109+
<div class="flex items-center px-2" title="Read the documentation.">
110+
<a class="p-2 rounded hover:bg-coolgray-200 hover:no-underline group-hover:dark:text-white text-neutral-600"
111+
onclick="event.stopPropagation()" :href="service.documentation"
112+
target="_blank">
113+
Docs
114+
</a>
115+
</div>
116+
</template>
117+
</x-slot:documentation>
118+
</x-resource-view>
119+
</div>
120+
</template>
121+
</div>
122+
</div>
123+
<div
124+
x-show="filteredGitBasedApplications.length === 0 && filteredDockerBasedApplications.length === 0 && filteredDatabases.length === 0 && filteredServices.length === 0 && loading === false">
125+
<div>No resources found.</div>
126+
</div>
123127
</div>
124128
<script>
125129
function sortFn(a, b) {
@@ -144,7 +148,7 @@ function searchResources() {
144148
gitBasedApplications,
145149
dockerBasedApplications,
146150
databases
147-
} = await this.$wire.loadServices2();
151+
} = await this.$wire.loadServices();
148152
this.services = services;
149153
this.gitBasedApplications = gitBasedApplications;
150154
this.dockerBasedApplications = dockerBasedApplications;

0 commit comments

Comments
 (0)