feat(project): enhance project index with resource creation capabilities

- Added logic to determine if the user can create resources for each project and generate the corresponding route for adding resources based on the project's first environment.
- Updated the project index view to display the new resource creation option alongside existing project settings.
- Adjusted various views to include a margin-top adjustment for better layout consistency.
This commit is contained in:
Andras Bacsai
2025-10-07 17:17:31 +02:00
parent 618378714a
commit 201e30e849
9 changed files with 29 additions and 41 deletions

View File

@@ -11,49 +11,29 @@
@endcan
</div>
<div class="subtitle">All your projects are here.</div>
<div x-data="searchComponent()" class="-mt-1">
<x-forms.input placeholder="Search for name, description..." x-model="search" id="null" />
<div class="grid grid-cols-2 gap-4 pt-4">
<template x-if="filteredProjects.length === 0">
<div>No project found with the search term "<span x-text="search"></span>".</div>
</template>
<template x-for="project in filteredProjects" :key="project.uuid">
<div class="box group cursor-pointer" @click="$wire.navigateToProject(project.uuid)">
<div class="flex flex-col justify-center flex-1 mx-6">
<div class="grid grid-cols-1 gap-4 xl:grid-cols-2 -mt-1" x-data="{ projects: @js($projects) }">
<template x-for="project in projects" :key="project.uuid">
<div class="box group cursor-pointer" @click="$wire.navigateToProject(project.uuid)">
<div class="flex flex-1 mx-6">
<div class="flex flex-col justify-center flex-1">
<div class="box-title" x-text="project.name"></div>
<div class="box-description">
<div x-text="project.description"></div>
</div>
</div>
<div class="flex items-center justify-center gap-2 pt-4 pb-2 mr-4 text-xs lg:py-0 lg:justify-normal"
x-show="project.canUpdate">
<a class="mx-4 font-bold hover:underline" wire:click.stop
<div class="relative z-10 flex items-center justify-center gap-4 text-xs font-bold"
x-show="project.canUpdate || project.canCreateResource">
<a class="hover:underline" wire:click.stop x-show="project.addResourceRoute"
:href="project.addResourceRoute">
+ Add Resource
</a>
<a class="hover:underline" wire:click.stop x-show="project.canUpdate"
:href="`/project/${project.uuid}/edit`">
Settings
</a>
</div>
</div>
</template>
</div>
</div>
</template>
</div>
<script>
function searchComponent() {
return {
search: '',
get filteredProjects() {
const projects = @js($projects);
if (this.search === '') {
return projects;
}
const searchLower = this.search.toLowerCase();
return projects.filter(project => {
return (project.name?.toLowerCase().includes(searchLower) ||
project.description?.toLowerCase().includes(searchLower))
});
}
}
}
</script>
</div>