añadir nuevas funcionalidades

2025-04-30 20:56:28 +02:00
parent 883daf32ed
commit 655ea60d6b
71 changed files with 3836 additions and 1158 deletions
--- a/app/Helpers/FileHelper.php
+++ b/app/Helpers/FileHelper.php
@@ -0,0 +1,23 @@
+<?php
+
+// En App\Helpers\FileHelper.php
+namespace App\Helpers;
+
+class FileHelper
+{
+    public static function getFileType($filename)
+    {
+        $extension = strtolower(pathinfo($filename, PATHINFO_EXTENSION));
+        
+        return match($extension) {
+            'pdf' => 'pdf',
+            'doc', 'docx' => 'word',
+            'xls', 'xlsx' => 'excel',
+            'ppt', 'pptx' => 'powerpoint',
+            'jpg', 'jpeg', 'png', 'gif' => 'image',
+            'zip', 'rar' => 'archive',
+            'txt' => 'text',
+            default => 'document'
+        };
+    }
+}
--- a/app/Http/Controllers/DocumentCommentController.php
+++ b/app/Http/Controllers/DocumentCommentController.php
@@ -0,0 +1,82 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Models\Document;
+use App\Models\DocumentComment;
+use Illuminate\Http\Request;
+
+class DocumentCommentController extends Controller
+{
+    /**
+     * Display a listing of the resource.
+     */
+    public function index()
+    {
+        //
+    }
+
+    /**
+     * Show the form for creating a new resource.
+     */
+    public function create()
+    {
+        //
+    }
+
+    /**
+     * Store a newly created resource in storage.
+     */
+    public function store(Request $request, Document $document)
+    {
+        $request->validate([
+            'content' => 'required|string|max:1000',
+            'page' => 'required|integer|min:1',
+            'x' => 'required|numeric|between:0,1',
+            'y' => 'required|numeric|between:0,1'
+        ]);
+
+        $document->comments()->create([
+            'user_id' => auth()->id(),
+            'content' => $request->content,
+            'page' => $request->page,
+            'x' => $request->x,
+            'y' => $request->y,
+            'parent_id' => $request->parent_id
+        ]);
+
+        return back();
+    }
+
+    /**
+     * Display the specified resource.
+     */
+    public function show(DocumentComment $documentComment)
+    {
+        //
+    }
+
+    /**
+     * Show the form for editing the specified resource.
+     */
+    public function edit(DocumentComment $documentComment)
+    {
+        //
+    }
+
+    /**
+     * Update the specified resource in storage.
+     */
+    public function update(Request $request, DocumentComment $documentComment)
+    {
+        //
+    }
+
+    /**
+     * Remove the specified resource from storage.
+     */
+    public function destroy(DocumentComment $documentComment)
+    {
+        //
+    }
+}
--- a/app/Http/Controllers/DocumentController.php
+++ b/app/Http/Controllers/DocumentController.php
@@ -6,9 +6,13 @@ use App\Jobs\ProcessDocumentOCR;
 use App\Models\Document;
 use App\Models\Project;
 use Illuminate\Http\Request;
+use Illuminate\Support\Facades\Storage;

 class DocumentController extends Controller
 {
+    public $comments=[];
+
+
    /**
     * Display a listing of the resource.
     */
@@ -56,7 +60,19 @@ class DocumentController extends Controller
     */
    public function show(Document $document)
    {
-        //
+        $this->authorize('view', $document); // Si usas políticas
+
+        if (!Storage::exists($document->file_path)) {
+            abort(404);
+        }
+
+        $document->url = Storage::url($document->file_path);
+
+        return view('documents.show', [
+            'document' => $document,
+            'versions' => $document->versions()->latest()->get(),
+            'comments' => $this->comments,
+        ]);
    }

    /**
--- a/app/Http/Controllers/ProjectController.php
+++ b/app/Http/Controllers/ProjectController.php
@@ -17,12 +17,16 @@ class ProjectController extends Controller
     */
    public function index()
    {
-        $projects = Project::withCount('documents')
-            ->whereHas('users', function($query) {
+        $projects = auth()->user()->hasRole('admin') 
+        ? Project::get()  // Todos los proyectos para admin
+        : auth()->user()->projects()->latest()->get(); // Solo proyectos asignados
+
+        /*
+        $projects = Project::whereHas('users', function($query) {
            $query->where('user_id', auth()->id());
        })
        ->filter(['search' => request('search')])
-        ->paginate(9);
+        ->paginate(9);*/

        return view('projects.index', compact('projects'));
    }
@@ -47,24 +51,24 @@ class ProjectController extends Controller
    {
        $validated = $request->validate([
            'name' => 'required|string|max:255',
-            'description' => 'required|string',
-            'status' => 'required|in:active,inactive',
-            'team' => 'sometimes|array',
-            'team.*' => 'exists:users,id',
+            'description' => 'nullable|string',
+            'status' => 'required|in:Activo,Inactivo',
+            //'team' => 'sometimes|array',
+            //'team.*' => 'exists:users,id',
            'project_image' => 'nullable|image|mimes:jpeg,png,jpg,gif|max:2048',
            'address' => 'nullable|string|max:255',
            'province' => 'nullable|string|max:100',
-            'country' => 'nullable|string|size:2',
+            //'country' => 'nullable|string|size:2',
            'postal_code' => 'nullable|string|max:10',
            'latitude' => 'required|numeric|between:-90,90',
            'longitude' => 'required|numeric|between:-180,180',
-            'icon' => 'nullable|in:'.implode(',', config('project.icons')),
+            //'icon' => 'nullable|in:'.implode(',', config('project.icons')),
            'start_date' => 'nullable|date',
            'deadline' => 'nullable|date|after:start_date',
-            'categories' => 'array|exists:categories,id',
+            'categories' => 'nullable|array|exists:categories,id',
            //'categories' => 'required|array',
-            'categories.*' => 'exists:categories,id',
-            'documents.*' => 'file|max:5120|mimes:pdf,docx,xlsx,jpg,png'
+            //'categories.*' => 'exists:categories,id',
+            //'documents.*' => 'file|max:5120|mimes:pdf,docx,xlsx,jpg,png'
        ]);

        
@@ -89,6 +93,7 @@ class ProjectController extends Controller
            }
    
            // Manejar documentos adjuntos
+            /*
            if($request->hasFile('documents')) {
                foreach ($request->file('documents') as $file) {
                    $project->documents()->create([
@@ -96,14 +101,12 @@ class ProjectController extends Controller
                        'original_name' => $file->getClientOriginalName()
                    ]);
                }
-            }
+            }*/
    
-            return redirect()->route('projects.show', $project)
-                ->with('success', 'Proyecto creado exitosamente');
+            return redirect()->route('projects.show', $project)->with('success', 'Proyecto creado exitosamente');
    
        } catch (\Exception $e) {
-            return back()->withInput()
-                ->with('error', 'Error al crear el proyecto: ' . $e->getMessage());
+            return back()->withInput()->with('error', 'Error al crear el proyecto: ' . $e->getMessage());
        }
    }

@@ -112,7 +115,7 @@ class ProjectController extends Controller
     */
    public function show(Project $project)
    {
-        $this->authorize('view', $project); // Si usas políticas
+        //$this->authorize('view', $project); // Si usas políticas
        $project->load(['categories', 'documents']);
        
        return view('projects.show', [
--- a/app/Http/Controllers/UserController.php
+++ b/app/Http/Controllers/UserController.php
@@ -5,7 +5,14 @@ namespace App\Http\Controllers;
 use Illuminate\Http\Request;
 use App\Models\User;
 use Illuminate\Support\Facades\Hash;
-use App\Http\Requests\UpdateUserRequest;
+use App\Rules\PasswordRule;
+use Illuminate\Database\QueryException;
+use Illuminate\Support\Facades\Log;
+use Illuminate\Support\Facades\Storage;
+use Illuminate\Validation\Rule;
+use Illuminate\Validation\Rules\Password;
+use Illuminate\Validation\ValidationException;
+use Spatie\Permission\Models\Permission;
 use Spatie\Permission\Models\Role;

 class UserController extends Controller
@@ -13,7 +20,7 @@ class UserController extends Controller
    public function index()
    {
        $this->authorize('viewAny', User::class);
-        $users = User::with('roles')->paginate(10);
+        $users = User::paginate(10);
        return view('users.index', compact('users'));
    }

@@ -27,24 +34,62 @@ class UserController extends Controller
    public function store(Request $request)
    {
        $this->authorize('create', User::class);
-        
-        $data = $request->validate([
-            'name' => 'required|string|max:255',
+        try {
+            // Validación de datos
+            $validated = $request->validate([
+                'title' => 'nullable|string|max:10',
+                'first_name' => 'required|string|max:50',
+                'last_name' => 'required|string|max:50',
+                'username' => 'required|string|unique:users|max:30',
+                'password' => ['required',
+                                new PasswordRule(
+                                    minLength: 12,
+                                    requireUppercase: true,
+                                    requireNumeric: true,
+                                    requireSpecialCharacter: true,
+                                    //uncompromised: true, // Verificar contra Have I Been Pwned
+                                    //requireLetters: true
+                                ),
+                                Password::defaults()->mixedCase()->numbers()->symbols()
+                                    ->uncompromised(3) // Número mínimo de apariciones en brechas
+            ],
+                'start_date' => 'nullable|date',
+                'end_date' => 'nullable|date|after_or_equal:start_date',
                'email' => 'required|email|unique:users',
-            'password' => 'required|min:8|confirmed',
-            'roles' => 'array'
+                'phone' => 'nullable|string|max:20',
+                'address' => 'nullable|string|max:255',
+                'profile_photo_path' => 'nullable|string' // Ruta de la imagen subida por Livewire
            ]);

+            // Creación del usuario
            $user = User::create([
-            'name' => $data['name'],
-            'email' => $data['email'],
-            'password' => Hash::make($data['password'])
+                'title' => $validated['title'],
+                'first_name' => $validated['first_name'],
+                'last_name' => $validated['last_name'],
+                'username' => $validated['username'],
+                'password' => Hash::make($validated['password']),
+                'email' => $validated['email'],
+                'phone' => $validated['phone'],
+                'address' => $validated['address'],
+                'access_start' => $validated['start_date'],
+                'access_end' => $validated['end_date'],
+                'is_active' => true,
+                'profile_photo_path' => $validated['profile_photo_path'] ?? null
            ]);

-        $user->syncRoles($data['roles'] ?? []);
+            if ($request->hasFile('image_path')) {
+                $path = $request->file('image_path')->store('public/photos');
+                $user->profile_photo_path = basename($path);
+                $user->save();
+            }

-        return redirect()->route('users.index')
-            ->with('success', 'Usuario creado exitosamente');
+            // Asignación de roles (opcional, usando Spatie Permissions)
+            // $user->assignRole('user');
+
+            return redirect()->route('users.index')->with('success', 'Usuario creado exitosamente.')->with('temp_password', $validated['password']);;
+        } catch (\Exception $e) {
+            return back()->withInput()->with('error', 'Error al crear el usuario: ' . $e->getMessage());
+        }
    }

    public function edit(User $user)
@@ -52,17 +97,110 @@ class UserController extends Controller
        $this->authorize('update', $user);
        $roles = Role::all();
        $userRoles = $user->roles->pluck('id')->toArray();
-        
-        return view('users.edit', compact('user', 'roles', 'userRoles'));
+        return view('users.create', compact('user', 'roles', 'userRoles'));
    }

-    public function update(UpdateUserRequest $request, User $user)
+    public function update(Request $request, User $user)
    {
-        $user->update($request->validated());
-        $user->syncRoles($request->roles);
+        try {
+            // Validación de datos
+            $validated = $request->validate([
+                'title' => 'nullable|string|max:10',
+                'first_name' => 'required|string|max:50',
+                'last_name' => 'required|string|max:50',
+                'username' => [
+                    'required',
+                    'string',
+                    'max:30',
+                    Rule::unique('users')->ignore($user->id)
+                ],
+                'password' => [
+                    'nullable',
+                    Password::min(12)
+                        ->mixedCase()
+                        ->numbers()
+                        ->symbols()
+                        ->uncompromised(3)
+                ],
+                'start_date' => 'nullable|date',
+                'end_date' => 'nullable|date|after_or_equal:start_date',
+                'email' => [
+                    'required',
+                    'email',
+                    Rule::unique('users')->ignore($user->id)
+                ],
+                'phone' => 'nullable|string|max:20',
+                'address' => 'nullable|string|max:255',
+                'profile_photo_path' => 'nullable|string', // Añadido para la ruta de la imagen
+                //'is_active' => 'nullable|boolean' // Añadido para el estado activo
+            ]);
    
-        return redirect()->route('users.index')
-            ->with('success', 'Usuario actualizado correctamente');
+            // Preparar datos para actualización
+            $updateData = [
+                'title' => $validated['title'],
+                'first_name' => $validated['first_name'],
+                'last_name' => $validated['last_name'],
+                'username' => $validated['username'],
+                'email' => $validated['email'],
+                'phone' => $validated['phone'],
+                'address' => $validated['address'],
+                'access_start' => $validated['start_date'],
+                'access_end' => $validated['end_date'],
+                'is_active' => $validated['is_active'] ?? false,
+                'profile_photo_path' => $validated['profile_photo_path'] ?? $user->profile_photo_path
+            ];
+    
+            // Actualizar contraseña solo si se proporciona
+            if (!empty($validated['password'])) {
+                $updateData['password'] = Hash::make($validated['password']);
+            }
+    
+            // Eliminar imagen anterior si se está actualizando
+            if (isset($validated['profile_photo_path']) && $user->profile_photo_path) {
+                Storage::disk('public')->delete($user->profile_photo_path);
+            }
+    
+            // Actualizar el usuario
+            $user->update($updateData);
+    
+            // Redireccionar con mensaje de éxito
+            return redirect()->route('users.show', $user)
+                ->with('success', 'Usuario actualizado exitosamente');
+    
+        } catch (ValidationException $e) {
+            return redirect()->back()->withErrors($e->validator)->withInput();
+                
+        } catch (QueryException $e) {
+            $errorCode = $e->errorInfo[1];
+            $errorMessage = 'Error al actualizar el usuario: ';
+            
+            if ($errorCode == 1062) {
+                $errorMessage .= 'El nombre de usuario o correo electrónico ya está en uso';
+            } else {
+                $errorMessage .= 'Error en la base de datos';
+            }
+    
+            Log::error("Error actualizando usuario ID {$user->id}: " . $e->getMessage());
+            return redirect()->back()->with('error', $errorMessage)->withInput();
+    
+        } catch (\Exception $e) {
+            Log::error("Error general actualizando usuario ID {$user->id}: " . $e->getMessage());
+            return redirect()->back()->with('error', 'Ocurrió un error inesperado al actualizar el usuario')->withInput();
+        }
+    }
+
+    public function show(User $user)
+    {
+        $previousUser = User::where('id', '<', $user->id)->latest('id')->first();
+        $nextUser = User::where('id', '>', $user->id)->oldest('id')->first();
+        $permissionGroups = $this->getPermissionGroups($user);
+
+        return view('users.show', [
+            'user' => $user,
+            'previousUser' => $previousUser,
+            'nextUser' => $nextUser,
+            'permissionGroups' => $permissionGroups,
+        ]);
    }

    public function updatePassword(Request $request, User $user)
@@ -94,4 +232,45 @@ class UserController extends Controller
        return redirect()->route('users.index')
            ->with('success', 'Usuario eliminado correctamente');
    }
+
+    private function getPermissionGroups(User $user)
+    {
+        // Obtener todos los permisos disponibles
+        $allPermissions = Permission::all();
+        
+        // Agrupar permisos por tipo (asumiendo que los nombres siguen el formato "tipo.acción")
+        $grouped = $allPermissions->groupBy(function ($permission) {
+            return explode('.', $permission->name)[0]; // Extrae "user" de "user.create"
+        });
+        
+        // Formatear para la vista
+        $groups = [];
+        foreach ($grouped as $groupName => $permissions) {
+            $groups[$groupName] = [
+                'name' => ucfirst($groupName),
+                'permissions' => $permissions->map(function ($permission) use ($user) {
+                    return [
+                        'id' => $permission->id,
+                        'name' => $permission->name,
+                        'description' => $this->getPermissionDescription($permission->name),
+                        'enabled' => $user->hasPermissionTo($permission)
+                    ];
+                })
+            ];
+        }
+        
+        return $groups;
+    }
+
+    private function getPermissionDescription($permissionName)
+    {
+        $descriptions = [
+            'user.create' => 'Crear nuevos usuarios',
+            'user.edit' => 'Editar usuarios existentes',
+            'document.view' => 'Ver documentos',
+            // Agrega más descripciones según necesites
+        ];
+        
+        return $descriptions[$permissionName] ?? str_replace('.', ' ', $permissionName);
+    }
 }
--- a/app/Livewire/CountrySelect.php
+++ b/app/Livewire/CountrySelect.php
@@ -0,0 +1,66 @@
+<?php
+
+namespace App\Livewire;
+
+use Livewire\Component;
+
+class CountrySelect extends Component
+{
+    public $selectedCountry;
+    public $countrySearch = '';
+    public $search = '';
+    public $isOpen = false;
+    public $initialCountry;
+    
+    protected $rules = [
+        'selectedCountry' => 'required',
+    ];
+
+    public function mount($initialCountry = null)
+    {
+        $this->selectedCountry = $initialCountry;
+    }
+
+    public function selectCountry($code)
+    {
+        $this->selectedCountry = $code;
+        $this->isOpen = false;
+        $this->search = ''; // Limpiar la búsqueda al seleccionar
+    }
+    
+    public function render()
+    {
+        $countries = collect(config('countries'))
+            ->when($this->search, function($collection) {
+                // Corregimos el filtrado aquí
+                return $collection->filter(function($name, $code) {
+                    $searchLower = strtolower($this->search);
+                    $nameLower = strtolower($name);
+                    $codeLower = strtolower($code);
+                    
+                    return str_contains($nameLower, $searchLower) || 
+                           str_contains($codeLower, $searchLower);
+                });
+            });
+            
+        return view('livewire.country-select', compact('countries'));
+    }
+    
+    public function formattedCountry($code, $name)
+    {
+        return $this->getFlagEmoji($code).' '.$name.' ('.strtoupper($code).')';
+    }
+    
+    protected function getFlagEmoji($countryCode) 
+    {
+        $countryCode = strtoupper($countryCode);
+        $flagOffset = 0x1F1E6;
+        $asciiOffset = 0x41;
+        
+        $firstChar = ord($countryCode[0]) - $asciiOffset + $flagOffset;
+        $secondChar = ord($countryCode[1]) - $asciiOffset + $flagOffset;
+        
+        return mb_convert_encoding('&#'.intval($firstChar).';', 'UTF-8', 'HTML-ENTITIES')
+             . mb_convert_encoding('&#'.intval($secondChar).';', 'UTF-8', 'HTML-ENTITIES');
+    }
+}
--- a/app/Livewire/ImageUploader.php
+++ b/app/Livewire/ImageUploader.php
@@ -0,0 +1,86 @@
+<?php
+
+namespace App\Livewire;
+
+use Livewire\Component;
+use Livewire\WithFileUploads;
+use Illuminate\Support\Facades\Storage;
+
+class ImageUploader extends Component
+{
+    use WithFileUploads;
+
+    public $image;
+    public $imagePath;
+    public $fieldName; // Nombre del campo para el formulario
+    public $label = 'Subir imagen'; // Etiqueta personalizable
+    public $hover = false;
+
+    // Recibir parámetros si es necesario
+    public function mount($fieldName = 'image_path', $label = 'Subir imagen')
+    {
+        $this->fieldName = $fieldName;
+        $this->label = $label;
+    }
+
+    public function updatedImage()
+    {
+        $this->validate([
+            'image' => 'image|max:2048', // 2MB Max
+        ]);
+
+        // Subir automáticamente al seleccionar
+        $this->uploadImage();
+    }
+
+    public function uploadImage()
+    {
+        $this->validate([
+            'image' => 'required|image|max:2048',
+        ]);
+
+        // Guardar la imagen
+        $this->imagePath = $this->image->store('uploads', 'public');
+        // Emitir evento con el nombre del campo y la ruta
+        $this->dispatch('imageUploaded', 
+            field: $this->fieldName,
+            path: $this->imagePath
+        );
+    }
+
+    public function save()
+    {
+        $this->validate([
+            'image' => 'required|image|max:2048',
+        ]);
+
+        // Guardar la imagen
+        $this->imagePath = $this->image->store('images', 'public');
+        
+        // Emitir evento con el nombre del campo y la ruta
+        $this->emit('imageUploaded', [
+            'field' => $this->fieldName,
+            'path' => $this->imagePath
+        ]);
+    }
+
+    public function removeImage()
+    {
+        $this->reset(['image', 'imagePath']);
+        
+        // Cambiar emit por dispatch en Livewire v3+
+        $this->dispatch('imageRemoved', 
+            field: $this->fieldName
+        );
+    }
+
+    public function toggleHover($status)
+    {
+        $this->hover = $status;
+    }
+    
+    public function render()
+    {
+        return view('livewire.image-uploader');
+    }
+}
--- a/app/Livewire/ProjectShow.php
+++ b/app/Livewire/ProjectShow.php
@@ -9,12 +9,15 @@ use App\Models\Project;
 use App\Models\Folder;
 use App\Models\Document;
 use Illuminate\Validation\Rule;
+use Illuminate\Support\Facades\Auth;

 class ProjectShow extends Component
 {

    use WithFileUploads;

+    protected $middleware = ['auth']; // Añade esto
+
    public Project $project;
    public ?Folder $currentFolder = null;
    public $expandedFolders = [];
@@ -22,6 +25,11 @@ class ProjectShow extends Component
    public $folderName = '';

    public $selectedFolderId = null;
+    public $showFolderModal = false;
+    public $showUploadModal = false;
+    public $tempFiles = [];
+    public $selectedFiles = []; // Archivos temporales en el modal
+    public $uploadProgress = [];

    
    public function mount(Project $project)
@@ -57,13 +65,13 @@ class ProjectShow extends Component
                })
            ]
        ]);
-
        Folder::create([
            'name' => $this->folderName,
            'project_id' => $this->project->id,
-            'parent_id' => $this->currentFolder?->id
+            'parent_id' => $this->currentFolder?->id,
        ]);

+        $this->hideCreateFolderModal();
        $this->reset('folderName');
        $this->project->load('rootFolders');        // Recargar carpetas raíz
        if ($this->currentFolder) {
@@ -72,12 +80,12 @@ class ProjectShow extends Component
        $this->project->refresh();
    }

-    public function uploadFiles(): void
+    /*public function uploadFiles(): void
    {
        $this->validate([
            'files.*' => 'file|max:10240|mimes:pdf,docx,xlsx,jpg,png'
        ]);
-
+        dd($this->files);
        foreach ($this->files as $file) {
            Document::create([
                'name' => $file->getClientOriginalName(),
@@ -92,7 +100,7 @@ class ProjectShow extends Component
            $this->currentFolder->refresh(); // Recargar documentos
        }
        $this->reset('files');
-    }
+    }*/

    public function getDocumentsProperty()
    {
@@ -116,11 +124,128 @@ class ProjectShow extends Component
        return $breadcrumbs;
    }

-    public function render()
+    public function showCreateFolderModal()
    {
-        return view('livewire.project-show')
-            ->layout('layouts.livewire-app', [
-                'title' => $this->project->name
+        $this->folderName = '';
+        $this->showFolderModal = true;
+    }
+
+    public function hideCreateFolderModal()
+    {
+        $this->showFolderModal = false;
+    }
+
+    // Método para abrir el modal
+    public function openUploadModal(): void
+    {
+        $this->showUploadModal = true;
+    }
+
+    // Método para manejar archivos seleccionados
+    public function selectFiles($files): void
+    {
+        $this->validate([
+            'selectedFiles.*' => 'file|max:10240|mimes:pdf,docx,xlsx,jpg,png'
+        ]);
+        
+        $this->selectedFiles = array_merge($this->selectedFiles, $files);
+    }
+
+    // Método para eliminar un archivo de la lista
+    public function removeFile($index): void
+    {
+        unset($this->selectedFiles[$index]);
+        $this->selectedFiles = array_values($this->selectedFiles); // Reindexar array
+    }
+
+    // Método para confirmar y guardar
+    public function uploadFiles(): void
+    {
+        foreach ($this->selectedFiles as $file) {
+            Document::create([
+                'name' => $file->getClientOriginalName(),
+                'file_path' => $file->store("projects/{$this->project->id}/documents"),
+                'project_id' => $this->project->id, // Asegurar que se envía
+                'folder_id' => $this->currentFolder?->id,
+                //'user_id' => Auth::id(),
+                //'status' => 'active' // Añadir si tu modelo lo requiere
+            ]);
+        }
+    
+        $this->resetUpload();
+        $this->project->refresh();
+    }
+
+    // Método para procesar los archivos
+    protected function processFiles(): void
+    {
+        foreach ($this->files as $file) {
+            Document::create([
+                'name' => $file->getClientOriginalName(),
+                'file_path' => $file->store("projects/{$this->project->id}/documents"),
+                'project_id' => $this->project->id, // Asegurar que se envía
+                'folder_id' => $this->currentFolder?->id,
+                //'user_id' => Auth::id(),
+                //'status' => 'active' // Añadir si tu modelo lo requiere
+            ]);
+        }
+    }
+
+    // Método para resetear
+    public function resetUpload(): void
+    {
+        $this->reset(['selectedFiles', 'showUploadModal', 'uploadProgress']);
+    }
+
+    #[On('upload-progress')]
+    public function updateProgress($name, $progress)
+    {
+        $this->uploadProgress[$name] = $progress;
+    }
+
+    public function addFiles($files)
+    {
+        $this->validate([
+            'selectedFiles.*' => 'file|max:10240|mimes:pdf,docx,xlsx,jpg,png'
+        ]);
+        
+        $this->selectedFiles = array_merge($this->selectedFiles, $files);
+    }
+
+    public function startUpload()
+    {
+        foreach ($this->selectedFiles as $file) {
+            try {
+                $path = $file->store(
+                    "projects/{$this->project->id}/".($this->currentFolder ? "folders/{$this->currentFolder->id}" : ""),
+                    'public'
+                );
+                
+                Document::create([
+                    'name' => $file->getClientOriginalName(),
+                    'file_path' => $path,
+                    'project_id' => $this->project->id,
+                    'folder_id' => $this->currentFolder?->id,
+                    'user_id' => Auth::id()
+                ]);
+                
+            } catch (\Exception $e) {
+                $this->addError('upload', "Error subiendo {$file->getClientOriginalName()}: {$e->getMessage()}");
+            }
+        }
+        
+        $this->resetUpload();
+        $this->project->refresh();
+    }
+
+    public function render()
+    {
+        return view('livewire.project.show')->layout('components.layouts.documents', [
+            'title' => __('Project: :name', ['name' => $this->project->name]),
+            'breadcrumbs' => [
+                ['name' => __('Projects'), 'url' => route('projects.index')],
+                ['name' => $this->project->name, 'url' => route('projects.show', $this->project)],
+            ],
        ]);
    }
 }
--- a/app/Livewire/UserPhotoUpload.php
+++ b/app/Livewire/UserPhotoUpload.php
@@ -0,0 +1,81 @@
+<?php
+
+namespace App\Livewire;
+
+use App\Models\User;
+use Livewire\Component;
+use Livewire\WithFileUploads;
+use Illuminate\Support\Facades\Storage;
+
+class UserPhotoUpload extends Component
+{
+    use WithFileUploads;
+
+    public $photo;
+    public $existingPhoto;
+    public $tempPhoto;
+    public $userId;
+
+    protected $listeners = ['photoUpdated' => 'refreshPhoto'];
+
+    public function mount($existingPhoto = null, $userId = null)
+    {
+        $this->existingPhoto = $existingPhoto;
+        $this->userId = $userId;
+    }
+
+    public function uploadPhoto()
+    {
+        $this->validate([
+            'photo' => 'image|max:2048|mimes:jpg,png,jpeg,gif',
+        ]);
+
+        $this->tempPhoto = $this->photo->temporaryUrl();
+    }
+
+    public function updatedPhoto()
+    {
+        $this->validate([
+            'photo' => 'image|max:2048|mimes:jpg,png,jpeg,gif',
+        ]);
+
+        $this->tempPhoto = $this->photo->temporaryUrl();
+
+        // Emitir evento con la foto temporal
+        $this->emit('photoUploaded', $this->photo->getRealPath());
+    }
+
+    public function removePhoto()
+    {
+        $this->reset('photo', 'tempPhoto');
+    }
+
+    public function deletePhoto()
+    {
+        if ($this->existingPhoto) {
+            Storage::delete('public/photos/' . $this->existingPhoto);
+            
+            if ($this->userId) {
+                $user = User::find($this->userId);
+                $user->update(['profile_photo_path' => null]);
+            }
+            
+            $this->existingPhoto = null;
+            $this->emit('photoDeleted');
+        }
+    }
+
+    public function refreshPhoto()
+    {
+        $this->existingPhoto = User::find($this->userId)->profile_photo_path;
+    }
+
+    public function render()
+    {
+        return view('livewire.user-photo-upload', [
+            //'photo' => $this->photo,
+            'tempPhoto' => $this->tempPhoto,
+            'existingPhoto' => $this->existingPhoto,
+        ]);
+    }
+}
--- a/app/Livewire/UserTable.php
+++ b/app/Livewire/UserTable.php
@@ -0,0 +1,109 @@
+<?php
+
+namespace App\Livewire;
+
+use Livewire\Component;
+use Livewire\WithPagination;
+use App\Models\User;
+
+class UserTable extends Component
+{
+    use WithPagination;
+
+    public $sortField = 'first_name';
+    public $sortDirection = 'asc';
+
+    public $columns = [
+        'full_name' => true,
+        'is_active' => true,
+        'username' => true,
+        'email' => true,
+        'phone' => false,
+        'access_start' => false,
+        'created_at' => false,
+        'is_active' => false,
+    ];
+
+    public $filters = [
+        'full_name' => '',
+        'is_active' => '',
+        'username' => '',
+        'email' => '',
+        'phone' => '',
+        'access_start' => '',
+        'created_at' => ''
+    ];
+
+    protected $queryString = [
+        'filters' => ['except' => ''],
+        'columns' => ['except' => '']
+    ];
+
+    public function mount()
+    {
+        // Recuperar preferencias de columnas de la sesión
+        $this->columns = session('user_columns', $this->columns);
+    }
+
+    public function updatedColumns()
+    {
+        // Guardar preferencias en sesión
+        session(['user_columns' => $this->columns]);
+    }
+
+    public function sortBy($field)
+    {
+        if ($this->sortField === $field) {
+            $this->sortDirection = $this->sortDirection === 'asc' ? 'desc' : 'asc';
+        } else {
+            $this->sortDirection = 'asc';
+        }
+        
+        $this->sortField = $field;
+    }
+
+    public function render()
+    {
+        $users = User::query()
+            ->when($this->filters['full_name'], fn($q, $search) => 
+                $q->whereRaw("CONCAT(title, ' ', first_name, ' ', last_name) LIKE ?", ["%$search%"]))
+            ->when($this->sortField === 'full_name', fn($q) => 
+                $q->orderByRaw("CONCAT(title, ' ', first_name, ' ', last_name) " . $this->sortDirection)
+            )
+            ->when($this->sortField === 'created_at', fn($q) => 
+                $q->orderBy('created_at', $this->sortDirection)
+            )
+            ->when($this->sortField === 'access_start', fn($q) => 
+                $q->orderBy('access_start', $this->sortDirection)
+            )
+            ->when(in_array($this->sortField, ['username', 'email', 'phone']), fn($q) => 
+                $q->orderBy($this->sortField, $this->sortDirection)
+            )
+            ->when($this->filters['full_name'], fn($q, $search) => 
+                $q->whereRaw("CONCAT(title, ' ', first_name, ' ', last_name) LIKE ?", ["%$search%"]))
+            ->when($this->filters['username'], fn($q, $search) => 
+                $q->where('username', 'LIKE', "%$search%"))
+            ->when($this->filters['email'], fn($q, $search) => 
+                $q->where('email', 'LIKE', "%$search%"))
+            ->when($this->filters['phone'], fn($q, $search) => 
+                $q->where('phone', 'LIKE', "%$search%"))
+            ->when($this->filters['access_start'], fn($q, $date) => 
+                $q->whereDate('access_start', $date))
+            ->when($this->filters['created_at'], fn($q, $date) => 
+                $q->whereDate('created_at', $date))
+            ->paginate(10);
+
+        return view('livewire.user-table', [
+            'users' => $users,
+            'available_columns' => [
+                'full_name' => 'Nombre Completo',
+                'username' => 'Usuario',
+                'email' => 'Correo',
+                'phone' => 'Teléfono',
+                'access_start' => 'Fecha de acceso',
+                'created_at' => 'Fecha creación',
+                'is_active' => 'Estado'
+            ]
+        ]);
+    }
+}
--- a/app/Models/Comment.php
+++ b/app/Models/Comment.php
@@ -0,0 +1,36 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+
+class Comment extends Model
+{
+    use HasFactory;
+
+    protected $fillable = [
+        'content',
+        'user_id',
+        'document_id',
+        'parent_id',
+        'page',
+        'x',
+        'y'
+    ];
+
+    public function user()
+    {
+        return $this->belongsTo(User::class);
+    }
+
+    public function document()
+    {
+        return $this->belongsTo(Document::class);
+    }
+
+    public function replies()
+    {
+        return $this->hasMany(Comment::class, 'parent_id');
+    }
+}
--- a/app/Models/Document.php
+++ b/app/Models/Document.php
@@ -17,10 +17,11 @@ class Document extends Model

    protected $fillable = [
        'name',
-        'status',
-        'project_id',
+        'file_path',
+        'project_id', // Asegurar que está en fillable
        'folder_id',
-        'current_version_id'
+        'user_id',
+        'status'
    ];


@@ -36,6 +37,7 @@ class Document extends Model
        return $this->hasMany(Comment::class)->whereNull('parent_id');
    }

+
    public function createVersion($file)
    {
        return $this->versions()->create([
--- a/app/Models/DocumentComment.php
+++ b/app/Models/DocumentComment.php
@@ -0,0 +1,22 @@
+<?php
+
+namespace App\Models;
+
+use Illuminate\Database\Eloquent\Model;
+
+class DocumentComment extends Model
+{
+    protected $fillable = ['content', 'page', 'x', 'y', 'parent_id'];
+    
+    public function user() {
+        return $this->belongsTo(User::class);
+    }
+    
+    public function children() {
+        return $this->hasMany(DocumentComment::class, 'parent_id');
+    }
+    
+    public function parent() {
+        return $this->belongsTo(DocumentComment::class, 'parent_id');
+    }
+}
--- a/app/Models/Folder.php
+++ b/app/Models/Folder.php
@@ -10,9 +10,9 @@ class Folder extends Model
        'name',
        'parent_id',
        'project_id',
-        'icon',
-        'color',
-        'description',
+        //'icon',
+        //'color',
+        //'description',
    ];

    public function descendants()
--- a/app/Models/User.php
+++ b/app/Models/User.php
@@ -7,6 +7,7 @@ use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\SoftDeletes;
 use Illuminate\Foundation\Auth\User as Authenticatable;
 use Illuminate\Notifications\Notifiable;
+use Illuminate\Support\Facades\Storage;
 use Illuminate\Support\Str;
 use Spatie\Permission\Traits\HasRoles;

@@ -21,9 +22,18 @@ class User extends Authenticatable
     * @var list<string>
     */
    protected $fillable = [
-        'name',
+        'title',
+        'first_name',
+        'last_name',
+        'username',
        'email',
        'password',
+        'phone',
+        'address',
+        'access_start',
+        'access_end',
+        'is_active',
+        'profile_photo_path',
    ];

    /**
@@ -39,26 +49,25 @@ class User extends Authenticatable
    /**
     * Get the attributes that should be cast.
     *
-     * @return array<string, string>
+      * @var list<string>
     */
-    protected function casts(): array
-    {
-        return [
+    protected $casts = [
        'email_verified_at' => 'datetime',
-            'password' => 'hashed',
-            'is_protected' => 'boolean',
+        'access_start' => 'date',
+        'access_end' => 'date',
+        'is_active' => 'boolean'
    ];
-    }

    /**
     * Get the user's initials
     */
    public function initials(): string
    {
-        return Str::of($this->name)
+        /*return Str::of($this->name)
            ->explode(' ')
            ->map(fn (string $name) => Str::of($name)->substr(0, 1))
-            ->implode('');
+            ->implode('');*/
+        return Str::of('');
    }

    public function groups()
@@ -90,4 +99,15 @@ class User extends Authenticatable
               });
    }

+    public function getFullNameAttribute()
+    {
+        return "{$this->title} {$this->first_name} {$this->last_name}";
+    }
+
+    // Accesor para la URL completa
+    public function getProfilePhotoUrlAttribute()
+    {
+        return $this->profile_photo ? Storage::url($this->profile_photo) : asset('images/default-user.png');
+    }
+    
 }
--- a/app/Policies/DashboardPolicy.php
+++ b/app/Policies/DashboardPolicy.php
@@ -16,6 +16,6 @@ class DashboardPolicy
    
    public function view(User $user)
    {
-        return $user->hasPermissionTo('view dashboard');
+        return true; //$user->hasPermissionTo('view.dashboard');
    }
 }
--- a/app/Policies/DocumentPolicy.php
+++ b/app/Policies/DocumentPolicy.php
@@ -16,7 +16,7 @@ class DocumentPolicy
     */
    public function viewAny(User $user): bool
    {
-        return false;
+        return $user->hasPermissionTo('document.view');
    }

    /**
@@ -24,7 +24,7 @@ class DocumentPolicy
     */
    public function view(User $user, Document $document)
    {
-        return $user->hasPermissionTo('view documents') 
+        return $user->hasPermissionTo('document.view') 
            && $user->hasProjectAccess($document->project_id)
            && $user->hasPermissionToResource($document->resource(), 'view');
    }
@@ -42,7 +42,7 @@ class DocumentPolicy
     */
    public function update(User $user, Document $document): bool
    {
-        return $user->hasPermissionToResource($document->resource(), 'edit');
+        return $user->hasPermissionToResource($document->resource(), 'document.edit');
    }

    /**
@@ -50,7 +50,7 @@ class DocumentPolicy
     */
    public function delete(User $user, Document $document): bool
    {
-        return $user->hasPermissionTo('delete documents');
+        return $user->hasPermissionTo('document.delete');
    }

    /**
--- a/app/Policies/FolderPolicy.php
+++ b/app/Policies/FolderPolicy.php
@@ -22,18 +22,18 @@ class FolderPolicy
                   $user->projects->contains($folder->project_id);
        }
        
-        return $user->can('manage-projects');
+        return $user->can('project.create');
    }

    public function move(User $user, Folder $folder)
    {
-        return $user->can('manage-projects') && 
+        return $user->can('project.create') && 
               $user->projects->contains($folder->project_id);
    }

    public function delete(User $user, Folder $folder)
    {
-        return $user->can('delete-projects') && 
+        return $user->can('project.delete') && 
               $user->projects->contains($folder->project_id);
    }
 }
--- a/app/Policies/PermissionPolicy.php
+++ b/app/Policies/PermissionPolicy.php
@@ -14,7 +14,7 @@ class PermissionPolicy
     */
    public function viewAny(User $user): bool
    {
-        return $user->hasPermissionTo('view permissions');
+        return $user->hasPermissionTo('permission.view');
    }

    /**
@@ -22,7 +22,7 @@ class PermissionPolicy
     */
    public function view(User $user, Permission $permission): bool
    {
-        return $user->hasPermissionTo('view permissions');
+        return $user->hasPermissionTo('permission.view');
    }

    /**
@@ -30,7 +30,7 @@ class PermissionPolicy
     */
    public function create(User $user): bool
    {
-        return $user->hasPermissionTo('create permissions');
+        return $user->hasPermissionTo('permission.create');
    }

    /**
@@ -40,7 +40,7 @@ class PermissionPolicy
    {
        if($permission->is_system) return false;
        
-        return $user->hasPermissionTo('edit permissions');
+        return $user->hasPermissionTo('permission.edit');
    }

    /**
@@ -52,7 +52,7 @@ class PermissionPolicy
            return false;
        }
        
-        return $user->hasPermissionTo('delete permissions');
+        return $user->hasPermissionTo('permission.delete');
    }

    /**
@@ -60,7 +60,7 @@ class PermissionPolicy
     */
    public function restore(User $user, Permission $permission): bool
    {
-        return $user->hasPermissionTo('manage permissions');
+        return $user->hasPermissionTo('permission.create');
    }

    /**
@@ -68,6 +68,6 @@ class PermissionPolicy
     */
    public function forceDelete(User $user, Permission $permission): bool
    {
-        return $user->hasPermissionTo('manage permissions');
+        return $user->hasPermissionTo('permission.delete');
    }
 }
--- a/app/Policies/ProjectPolicy.php
+++ b/app/Policies/ProjectPolicy.php
@@ -13,7 +13,7 @@ class ProjectPolicy
     */
    public function viewAny(User $user): bool
    {
-        return $user->hasPermissionTo('view projects');
+        return $user->hasPermissionTo('project.view');
    }

    /**
@@ -21,7 +21,13 @@ class ProjectPolicy
     */
    public function view(User $user, Project $project): bool
    {
-        return $user->hasPermissionTo('view projects') && 
+        // Admin ve todo, otros usuarios solo proyectos asignados
+        /*
+        return $user->hasRole('admin') || 
+            $project->users->contains($user->id) ||
+            $project->manager_id === $user->id;*/
+
+        return $user->hasPermissionTo('project.view') && 
               $this->hasProjectAccess($user, $project);
    }

@@ -30,7 +36,7 @@ class ProjectPolicy
     */
    public function create(User $user): bool
    {
-        return $user->hasPermissionTo('create projects');
+        return $user->hasPermissionTo('project.create');
    }

    /**
@@ -38,7 +44,7 @@ class ProjectPolicy
     */
    public function update(User $user, Project $project): bool
    {
-        return $user->hasPermissionTo('edit projects') && 
+        return $user->hasPermissionTo('project.edit') && 
               $this->hasProjectAccess($user, $project);
    }

@@ -47,7 +53,7 @@ class ProjectPolicy
     */
    public function delete(User $user, Project $project): bool
    {
-        return $user->hasPermissionTo('delete projects') && 
+        return $user->hasPermissionTo('project.delete') && 
               $this->hasProjectAccess($user, $project);
    }

--- a/app/Policies/RolePolicy.php
+++ b/app/Policies/RolePolicy.php
@@ -13,7 +13,7 @@ class RolePolicy
     */
    public function viewAny(User $user): bool
    {
-        return $user->hasPermissionTo('view roles');
+        return $user->hasPermissionTo('role.view');
    }

    /**
@@ -21,7 +21,7 @@ class RolePolicy
     */
    public function view(User $user, Role $role): bool
    {
-        return false;
+        return $user->hasPermissionTo('role.view');
    }

    /**
@@ -29,7 +29,7 @@ class RolePolicy
     */
    public function create(User $user): bool
    {
-        return $user->hasPermissionTo('create roles');
+        return $user->hasPermissionTo('role.create');
    }

    /**
@@ -37,7 +37,7 @@ class RolePolicy
     */
    public function update(User $user, Role $role): bool
    {
-        return $user->hasPermissionTo('edit roles') && !$role->is_protected;
+        return $user->hasPermissionTo('role.edit') && !$role->is_protected;
    }

    /**
@@ -45,7 +45,7 @@ class RolePolicy
     */
    public function delete(User $user, Role $role): bool
    {
-        return $user->hasPermissionTo('delete roles') && !$role->is_protected;
+        return $user->hasPermissionTo('role.delete') && !$role->is_protected;
    }

    /**
--- a/app/Policies/UserPolicy.php
+++ b/app/Policies/UserPolicy.php
@@ -12,7 +12,7 @@ class UserPolicy
     */
    public function viewAny(User $user): bool
    {
-        return $user->hasPermissionTo('manage users');
+        return $user->hasPermissionTo('user.view');
    }

    /**
@@ -20,7 +20,7 @@ class UserPolicy
     */
    public function view(User $user, User $model): bool
    {
-        return false;
+        return $user->hasPermissionTo('user.view');
    }

    /**
@@ -28,7 +28,7 @@ class UserPolicy
     */
    public function create(User $user): bool
    {
-        return $user->hasPermissionTo('manage users');
+        return $user->hasPermissionTo('user.create');
    }

    /**
@@ -36,7 +36,7 @@ class UserPolicy
     */
    public function update(User $user, User $model): bool
    {
-        return $user->hasPermissionTo('manage users') && !$model->is_protected;
+        return $user->hasPermissionTo('user.create') && !$model->is_protected;
    }

    /**
@@ -44,7 +44,7 @@ class UserPolicy
     */
    public function delete(User $user, User $model): bool
    {
-        return $user->hasPermissionTo('manage users') 
+        return $user->hasPermissionTo('user.delete') 
        && !$model->is_protected
        && $user->id !== $model->id;
    }
--- a/app/Providers/AppServiceProvider.php
+++ b/app/Providers/AppServiceProvider.php
@@ -2,6 +2,11 @@

 namespace App\Providers;

+use App\Livewire\FileUpload;
+use App\Livewire\ImageUploader;
+use App\Livewire\ProjectShow;
+use App\Livewire\Toolbar;
+use App\View\Components\Multiselect;
 use Illuminate\Support\ServiceProvider;
 use Illuminate\Support\Facades\Blade;
 use Illuminate\Support\Facades\Validator;
@@ -25,12 +30,13 @@ class AppServiceProvider extends ServiceProvider
    {
        // Configuración de componentes Blade
        Blade::componentNamespace('App\\View\\Components', 'icons');
-        Blade::component('multiselect', \App\View\Components\Multiselect::class);
+        Blade::component('multiselect', Multiselect::class);

        // Registro de componentes Livewire
-        Livewire::component('project-show', \App\Http\Livewire\ProjectShow::class);
-        Livewire::component('file-upload', \App\Http\Livewire\FileUpload::class);
-        Livewire::component('toolbar', \App\Http\Livewire\Toolbar::class);
+        Livewire::component('project-show', ProjectShow::class);
+        Livewire::component('file-upload', FileUpload::class);
+        Livewire::component('toolbar', Toolbar::class);
+        Livewire::component('image-uploader', ImageUploader::class);

        // Validación personalizada
        Validator::extend('max_upload_size', function ($attribute, $value, $parameters, $validator) {
--- a/app/Providers/AppServiceProvider.php.back
+++ b/app/Providers/AppServiceProvider.php.back
@@ -1,66 +0,0 @@
-<?php
-
-namespace App\Providers;
-
-use App\Models\Document;
-use App\Models\Folder;
-use App\Models\Project;
-use App\Models\User;
-use App\Policies\DocumentPolicy;
-use App\Policies\FolderPolicy;
-use App\Policies\PermissionPolicy;
-use App\Policies\ProfilePolicy;
-use App\Policies\ProjectPolicy;
-use App\Policies\RolePolicy;
-use App\Policies\UserPolicy;
-use Illuminate\Support\Facades\Blade;
-use Illuminate\Support\Facades\Validator;
-use Illuminate\Support\ServiceProvider;
-use Livewire\Livewire;
-use Spatie\Permission\Models\Permission;
-use Spatie\Permission\Models\Role;
-
-class AppServiceProvider extends ServiceProvider
-{
-
-    protected $policies = [
-        User::class => UserPolicy::class,
-        User::class => ProfilePolicy::class,
-        Role::class => RolePolicy::class,
-        Permission::class => PermissionPolicy::class,
-        Document::class => DocumentPolicy::class,
-        Project::class => ProjectPolicy::class,
-        Folder::class => FolderPolicy::class,
-    ];
-
-    /**
-     * Register any application services.
-     */
-    public function register(): void
-    {
-        //
-    }
-
-    /**
-     * Bootstrap any application services.
-     */
-    public function boot(): void
-    {
-        //
-        Blade::componentNamespace('App\\View\\Components', 'icons');
-        Blade::component('multiselect', \App\View\Components\Multiselect::class);
-
-        Livewire::component('project-show', \App\Http\Livewire\ProjectShow::class);
-        Livewire::component('project-show', \App\Http\Livewire\FileUpload::class);
-        Livewire::component('toolbar', \App\Http\Livewire\Toolbar::class);
-
-        Validator::extend('max_upload_size', function ($attribute, $value, $parameters, $validator) {
-            $maxSize = env('MAX_UPLOAD_SIZE', 51200); // Default 50MB
-            $totalSize = array_reduce($value, function($sum, $file) {
-                return $sum + $file->getSize();
-            }, 0);
-            
-            return $totalSize <= ($maxSize * 1024);
-        });
-    }
-}
--- a/app/Rules/PasswordRule.php
+++ b/app/Rules/PasswordRule.php
@@ -0,0 +1,69 @@
+<?php
+
+namespace App\Rules;
+
+use Closure;
+use Illuminate\Contracts\Validation\ValidationRule;
+use Illuminate\Support\Str;
+
+class PasswordRule implements ValidationRule
+{
+
+    protected $minLength;
+    protected $requireUppercase;
+    protected $requireNumeric;
+    protected $requireSpecialCharacter;
+
+    public function __construct(
+        int $minLength = 8,
+        bool $requireUppercase = true,
+        bool $requireNumeric = true,
+        bool $requireSpecialCharacter = true
+    ) {
+        $this->minLength = $minLength;
+        $this->requireUppercase = $requireUppercase;
+        $this->requireNumeric = $requireNumeric;
+        $this->requireSpecialCharacter = $requireSpecialCharacter;
+    }
+
+    /**
+     * Run the validation rule.
+     *
+     * @param  \Closure(string, ?string=): \Illuminate\Translation\PotentiallyTranslatedString  $fail
+     */
+    public function validate(string $attribute, mixed $value, Closure $fail): void
+    {
+        //
+    }
+
+    public function passes($attribute, $value)
+    {
+        $passes = true;
+
+        if (strlen($value) < $this->minLength) {
+            $passes = false;
+        }
+
+        if ($this->requireUppercase && !preg_match('/[A-Z]/', $value)) {
+            $passes = false;
+        }
+
+        if ($this->requireNumeric && !preg_match('/[0-9]/', $value)) {
+            $passes = false;
+        }
+
+        if ($this->requireSpecialCharacter && !preg_match('/[\W_]/', $value)) {
+            $passes = false;
+        }
+
+        return $passes;
+    }
+
+    public function message()
+    {
+        return 'La contraseña debe contener al menos '.$this->minLength.' caracteres'.
+               ($this->requireUppercase ? ', una mayúscula' : '').
+               ($this->requireNumeric ? ', un número' : '').
+               ($this->requireSpecialCharacter ? ' y un carácter especial' : '');
+    }
+}
--- a/config/countries.php
+++ b/config/countries.php
@@ -1,8 +1,253 @@
 <?php

 return [
-    'ES' => 'España',
-    'FR' => 'Francia',
+    'AD' => 'Andorra',
+    'AE' => 'United Arab Emirates',
+    'AF' => 'Afghanistan',
+    'AG' => 'Antigua and Barbuda',
+    'AI' => 'Anguilla',
+    'AL' => 'Albania',
+    'AM' => 'Armenia',
+    'AO' => 'Angola',
+    'AQ' => 'Antarctica',
+    'AR' => 'Argentina',
+    'AS' => 'American Samoa',
+    'AT' => 'Austria',
+    'AU' => 'Australia',
+    'AW' => 'Aruba',
+    'AX' => 'Åland Islands',
+    'AZ' => 'Azerbaijan',
+    'BA' => 'Bosnia and Herzegovina',
+    'BB' => 'Barbados',
+    'BD' => 'Bangladesh',
+    'BE' => 'Belgium',
+    'BF' => 'Burkina Faso',
+    'BG' => 'Bulgaria',
+    'BH' => 'Bahrain',
+    'BI' => 'Burundi',
+    'BJ' => 'Benin',
+    'BL' => 'Saint Barthélemy',
+    'BM' => 'Bermuda',
+    'BN' => 'Brunei Darussalam',
+    'BO' => 'Bolivia, Plurinational State of',
+    'BQ' => 'Bonaire, Sint Eustatius and Saba',
+    'BR' => 'Brazil',
+    'BS' => 'Bahamas',
+    'BT' => 'Bhutan',
+    'BV' => 'Bouvet Island',
+    'BW' => 'Botswana',
+    'BY' => 'Belarus',
+    'BZ' => 'Belize',
+    'CA' => 'Canada',
+    'CC' => 'Cocos (Keeling) Islands',
+    'CD' => 'Congo, the Democratic Republic of the',
+    'CF' => 'Central African Republic',
+    'CG' => 'Congo',
+    'CH' => 'Switzerland',
+    'CI' => "Côte d'Ivoire",
+    'CK' => 'Cook Islands',
+    'CL' => 'Chile',
+    'CM' => 'Cameroon',
+    'CN' => 'China',
+    'CO' => 'Colombia',
+    'CR' => 'Costa Rica',
+    'CU' => 'Cuba',
+    'CV' => 'Cape Verde',
+    'CW' => 'Curaçao',
+    'CX' => 'Christmas Island',
+    'CY' => 'Cyprus',
+    'CZ' => 'Czech Republic',
+    'DE' => 'Germany',
+    'DJ' => 'Djibouti',
+    'DK' => 'Denmark',
+    'DM' => 'Dominica',
+    'DO' => 'Dominican Republic',
+    'DZ' => 'Algeria',
+    'EC' => 'Ecuador',
+    'EE' => 'Estonia',
+    'EG' => 'Egypt',
+    'EH' => 'Western Sahara',
+    'ER' => 'Eritrea',
+    'ES' => 'Spain',
+    'ET' => 'Ethiopia',
+    'FI' => 'Finland',
+    'FJ' => 'Fiji',
+    'FK' => 'Falkland Islands (Malvinas)',
+    'FM' => 'Micronesia, Federated States of',
+    'FO' => 'Faroe Islands',
+    'FR' => 'France',
+    'GA' => 'Gabon',
+    'GB' => 'United Kingdom',
+    'GD' => 'Grenada',
+    'GE' => 'Georgia',
+    'GF' => 'French Guiana',
+    'GG' => 'Guernsey',
+    'GH' => 'Ghana',
+    'GI' => 'Gibraltar',
+    'GL' => 'Greenland',
+    'GM' => 'Gambia',
+    'GN' => 'Guinea',
+    'GP' => 'Guadeloupe',
+    'GQ' => 'Equatorial Guinea',
+    'GR' => 'Greece',
+    'GS' => 'South Georgia and the South Sandwich Islands',
+    'GT' => 'Guatemala',
+    'GU' => 'Guam',
+    'GW' => 'Guinea-Bissau',
+    'GY' => 'Guyana',
+    'HK' => 'Hong Kong',
+    'HM' => 'Heard Island and McDonald Islands',
+    'HN' => 'Honduras',
+    'HR' => 'Croatia',
+    'HT' => 'Haiti',
+    'HU' => 'Hungary',
+    'ID' => 'Indonesia',
+    'IE' => 'Ireland',
+    'IL' => 'Israel',
+    'IM' => 'Isle of Man',
+    'IN' => 'India',
+    'IO' => 'British Indian Ocean Territory',
+    'IQ' => 'Iraq',
+    'IR' => 'Iran, Islamic Republic of',
+    'IS' => 'Iceland',
+    'IT' => 'Italy',
+    'JE' => 'Jersey',
+    'JM' => 'Jamaica',
+    'JO' => 'Jordan',
+    'JP' => 'Japan',
+    'KE' => 'Kenya',
+    'KG' => 'Kyrgyzstan',
+    'KH' => 'Cambodia',
+    'KI' => 'Kiribati',
+    'KM' => 'Comoros',
+    'KN' => 'Saint Kitts and Nevis',
+    'KP' => "Korea, Democratic People's Republic of",
+    'KR' => 'Korea, Republic of',
+    'KW' => 'Kuwait',
+    'KY' => 'Cayman Islands',
+    'KZ' => 'Kazakhstan',
+    'LA' => "Lao People's Democratic Republic",
+    'LB' => 'Lebanon',
+    'LC' => 'Saint Lucia',
+    'LI' => 'Liechtenstein',
+    'LK' => 'Sri Lanka',
+    'LR' => 'Liberia',
+    'LS' => 'Lesotho',
+    'LT' => 'Lithuania',
+    'LU' => 'Luxembourg',
+    'LV' => 'Latvia',
+    'LY' => 'Libyan Arab Jamahiriya',
+    'MA' => 'Morocco',
+    'MC' => 'Monaco',
+    'MD' => 'Moldova, Republic of',
+    'ME' => 'Montenegro',
+    'MF' => 'Saint Martin (French part)',
+    'MG' => 'Madagascar',
+    'MH' => 'Marshall Islands',
+    'MK' => 'Macedonia, the former Yugoslav Republic of',
+    'ML' => 'Mali',
+    'MM' => 'Myanmar',
+    'MN' => 'Mongolia',
+    'MO' => 'Macao',
+    'MP' => 'Northern Mariana Islands',
+    'MQ' => 'Martinique',
+    'MR' => 'Mauritania',
+    'MS' => 'Montserrat',
+    'MT' => 'Malta',
+    'MU' => 'Mauritius',
+    'MV' => 'Maldives',
+    'MW' => 'Malawi',
+    'MX' => 'Mexico',
+    'MY' => 'Malaysia',
+    'MZ' => 'Mozambique',
+    'NA' => 'Namibia',
+    'NC' => 'New Caledonia',
+    'NE' => 'Niger',
+    'NF' => 'Norfolk Island',
+    'NG' => 'Nigeria',
+    'NI' => 'Nicaragua',
+    'NL' => 'Netherlands',
+    'NO' => 'Norway',
+    'NP' => 'Nepal',
+    'NR' => 'Nauru',
+    'NU' => 'Niue',
+    'NZ' => 'New Zealand',
+    'OM' => 'Oman',
+    'PA' => 'Panama',
+    'PE' => 'Peru',
+    'PF' => 'French Polynesia',
+    'PG' => 'Papua New Guinea',
+    'PH' => 'Philippines',
+    'PK' => 'Pakistan',
+    'PL' => 'Poland',
+    'PM' => 'Saint Pierre and Miquelon',
+    'PN' => 'Pitcairn',
+    'PR' => 'Puerto Rico',
+    'PS' => 'Palestinian Territory, Occupied',
    'PT' => 'Portugal',
-    // ... resto de países
+    'PW' => 'Palau',
+    'PY' => 'Paraguay',
+    'QA' => 'Qatar',
+    'RE' => 'Réunion',
+    'RO' => 'Romania',
+    'RS' => 'Serbia',
+    'RU' => 'Russian Federation',
+    'RW' => 'Rwanda',
+    'SA' => 'Saudi Arabia',
+    'SB' => 'Solomon Islands',
+    'SC' => 'Seychelles',
+    'SD' => 'Sudan',
+    'SE' => 'Sweden',
+    'SG' => 'Singapore',
+    'SH' => 'Saint Helena, Ascension and Tristan da Cunha',
+    'SI' => 'Slovenia',
+    'SJ' => 'Svalbard and Jan Mayen',
+    'SK' => 'Slovakia',
+    'SL' => 'Sierra Leone',
+    'SM' => 'San Marino',
+    'SN' => 'Senegal',
+    'SO' => 'Somalia',
+    'SR' => 'Suriname',
+    'SS' => 'South Sudan',
+    'ST' => 'Sao Tome and Principe',
+    'SV' => 'El Salvador',
+    'SX' => 'Sint Maarten',
+    'SY' => 'Syrian Arab Republic',
+    'SZ' => 'Swaziland',
+    'TC' => 'Turks and Caicos Islands',
+    'TD' => 'Chad',
+    'TF' => 'French Southern Territories',
+    'TG' => 'Togo',
+    'TH' => 'Thailand',
+    'TJ' => 'Tajikistan',
+    'TK' => 'Tokelau',
+    'TL' => 'Timor-Leste',
+    'TM' => 'Turkmenistan',
+    'TN' => 'Tunisia',
+    'TO' => 'Tonga',
+    'TR' => 'Turkey',
+    'TT' => 'Trinidad and Tobago',
+    'TV' => 'Tuvalu',
+    'TW' => 'Taiwan, Province of China',
+    'TZ' => 'Tanzania, United Republic of',
+    'UA' => 'Ukraine',
+    'UG' => 'Uganda',
+    'UM' => 'United States Minor Outlying Islands',
+    'US' => 'United States',
+    'UY' => 'Uruguay',
+    'UZ' => 'Uzbekistan',
+    'VA' => 'Holy See (Vatican City State)',
+    'VC' => 'Saint Vincent and the Grenadines',
+    'VE' => 'Venezuela, Bolivarian Republic of',
+    'VG' => 'Virgin Islands, British',
+    'VI' => 'Virgin Islands, U.S.',
+    'VN' => 'Viet Nam',
+    'VU' => 'Vanuatu',
+    'WF' => 'Wallis and Futuna',
+    'WS' => 'Samoa',
+    'YE' => 'Yemen',
+    'YT' => 'Mayotte',
+    'ZA' => 'South Africa',
+    'ZM' => 'Zambia',
+    'ZW' => 'Zimbabwe',
 ];
--- a/database/migrations/2025_04_19_000001_create_folders_table.php
+++ b/database/migrations/2025_04_19_000001_create_folders_table.php
@@ -15,7 +15,7 @@ return new class extends Migration
            $table->id();
            $table->string('name');
            $table->foreignId('project_id')->constrained();
-            $table->foreignId('creator_id')->constrained('users');
+            //$table->foreignId('creator_id')->constrained('users');
            $table->timestamps();
        });
    }
--- a/database/migrations/2025_04_29_115501_update_users_table.php
+++ b/database/migrations/2025_04_29_115501_update_users_table.php
@@ -0,0 +1,51 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->string('title')->nullable()->after('id');
+            $table->string('first_name')->after('title');
+            $table->string('last_name')->after('first_name');
+            $table->string('username')->unique()->after('last_name');
+            $table->date('access_start')->nullable()->after('password');
+            $table->date('access_end')->nullable()->after('access_start');
+            $table->string('phone')->nullable()->after('email');
+            $table->text('address')->nullable()->after('phone');
+            $table->boolean('is_active')->default(true)->after('address');
+            $table->string('profile_photo_path')->nullable();
+            
+            // Eliminar campos no necesarios
+            $table->dropColumn('name');
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('users', function (Blueprint $table) {
+            $table->dropColumn('title');
+            $table->dropColumn('first_name');
+            $table->dropColumn('last_name');
+            $table->dropColumn('username');
+            $table->dropColumn('access_start');
+            $table->dropColumn('access_end');
+            $table->dropColumn('phone');
+            $table->dropColumn('address');
+            $table->dropColumn('is_active');
+            $table->dropColumn('profile_photo_path ');
+            
+            $table->string('name')->after('id');
+        });
+    }
+};
--- a/database/migrations/2025_05_03_202403_add_path_documents_table.php
+++ b/database/migrations/2025_05_03_202403_add_path_documents_table.php
@@ -0,0 +1,28 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('documents', function (Blueprint $table) {
+            $table->string('file_path')->require();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('documents', function (Blueprint $table) {
+            $table->dropColumn('file_path');
+        });
+    }
+};
--- a/database/migrations/2025_05_03_230019_create_document_comments_table.php
+++ b/database/migrations/2025_05_03_230019_create_document_comments_table.php
@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('document_comments', function (Blueprint $table) {
+            $table->id();
+            $table->foreignId('document_id')->constrained();
+            $table->foreignId('user_id')->constrained();
+            $table->foreignId('parent_id')->nullable()->constrained('document_comments');
+            $table->text('content');
+            $table->unsignedInteger('page');
+            $table->decimal('x', 5, 3); // Posición X normalizada (0-1)
+            $table->decimal('y', 5, 3); // Posición Y normalizada (0-1)
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::dropIfExists('document_comments');
+    }
+};
--- a/database/migrations/2025_05_06_151318_create_comments_table.php
+++ b/database/migrations/2025_05_06_151318_create_comments_table.php
@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('comments', function (Blueprint $table) {
+            $table->id();
+            $table->text('content');
+            $table->foreignId('user_id')->constrained();
+            $table->foreignId('document_id')->constrained();
+            $table->foreignId('parent_id')->nullable()->constrained('comments');
+            $table->unsignedInteger('page');
+            $table->decimal('x', 5, 3);  // Posición X (0-1)
+            $table->decimal('y', 5, 3);  // Posición Y (0-1)
+            $table->timestamps();
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::dropIfExists('comments');
+    }
+};
--- a/database/seeders/DatabaseSeeder.php
+++ b/database/seeders/DatabaseSeeder.php
@@ -3,9 +3,8 @@
 namespace Database\Seeders;

 use App\Models\User;
-// use Illuminate\Database\Console\Seeds\WithoutModelEvents;
 use Illuminate\Database\Seeder;
-use Spatie\Permission\Models\Permission;
+use Illuminate\Support\Facades\Hash;

 class DatabaseSeeder extends Seeder
 {
@@ -16,10 +15,14 @@ class DatabaseSeeder extends Seeder
    {
        // User::factory(10)->create();

-        User::factory()->create([
-            'name' => 'admin',
+        User::create([
+            'first_name' => 'Administrador',
+            'last_name' => '',
+            'username' => 'admin',
            'email' => 'admin@example.com',
-            'password' => '12345678',
+            'password' => Hash::make('12345678'),
+            'is_active' => true,
+            'access_start' => now(),
        ]);

        $this->call([
--- a/database/seeders/PermissionSeeder.php
+++ b/database/seeders/PermissionSeeder.php
@@ -13,6 +13,7 @@ class PermissionSeeder extends Seeder
     */
    public function run()
    {
+        /*
        $permissions = [
            // Permissions for Projects
            'create projects',
@@ -49,6 +50,22 @@ class PermissionSeeder extends Seeder
                'name' => $permission,
                'guard_name' => 'web'
            ]);
+        }*/
+
+        $permissions = [
+            'user' => ['view', 'create', 'edit', 'delete'],
+            'document' => ['view', 'upload', 'edit', 'delete', 'approve'],
+            'project' => ['view', 'create', 'edit', 'delete'],
+            'comment' => ['create', 'edit', 'delete'],
+            'folder' => ['view', 'create', 'edit', 'delete'],
+            'role' => ['view', 'create', 'edit', 'delete'],
+            'permission' => ['view', 'create', 'edit', 'delete'],
+        ];
+        
+        foreach ($permissions as $type => $actions) {
+            foreach ($actions as $action) {
+                Permission::create(['name' => "{$type}.{$action}"]);
+            }
        }
    }
 }
--- a/database/seeders/RolePermissionSeeder.php
+++ b/database/seeders/RolePermissionSeeder.php
@@ -23,48 +23,10 @@ class RolePermissionSeeder extends Seeder
            //['description' => 'Administrador del sistema']
        );

-        // Obtener o crear todos los permisos existentes
-        $permissions = Permission::all();
-        
-        if ($permissions->isEmpty()) {
-            // Crear permisos básicos si no existen
-            $permissions = collect([
-                'view projects',
-                'edit projects',
-                'delete projects',
-                'view roles',
-                'create roles',
-                'edit roles',
-                'delete roles',
-                'view permissions',
-                'create permissions',
-                'edit permissions',
-                'delete permissions',
-                'assign permissions',
-                'revoke permissions',
-                
-            ])->map(function ($permission) {
-                return Permission::updateOrCreate(
-                    ['name' => $permission],
-                    ['guard_name' => 'web']
-                );
-            });
-        }
-
        // Sincronizar todos los permisos con el rol admin
        $allPermissions = Permission::all();
        $adminRole->syncPermissions($allPermissions);
-        $adminRole->syncPermissions($permissions);

-        // Crear usuario admin si no existe
-        /*User::updateOrCreate(
-            ['email' => env('ADMIN_EMAIL', 'admin@example.com')],
-            [
-                'name' => 'Administrador',
-                'password' => bcrypt(env('ADMIN_PASSWORD', 'password')),
-                'email_verified_at' => now()
-            ]
-        )->assignRole($adminRole);*/
        $adminEmail = env('ADMIN_EMAIL', 'admin@example.com');
        $user = User::where('email', $adminEmail)->first();
        if ($user) {
@@ -75,9 +37,11 @@ class RolePermissionSeeder extends Seeder
        } else {
            // Crear solo si no existe
            User::create([
-                'name' => 'admin',
-                'email' => $adminEmail,
-                'password' => bcrypt(env('ADMIN_PASSWORD', '12345678')),
+                'first_name' => 'Administrador',
+                'username' => 'admin',
+                'email' => 'admin@example.com',
+                'password' => '12345678',
+                'is_active' => true,
                'email_verified_at' => now()
            ])->assignRole($adminRole);
        }
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
                "axios": "^1.7.4",
                "concurrently": "^9.0.1",
                "laravel-vite-plugin": "^1.0",
+                "pdfjs-dist": "^5.2.133",
                "quill": "^2.0.3",
                "tailwindcss": "^4.0.7",
                "vite": "^6.0"
@@ -430,6 +431,177 @@
                "react": ">= 16"
            }
        },
+        "node_modules/@napi-rs/canvas": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.70.tgz",
+            "integrity": "sha512-nD6NGa4JbNYSZYsTnLGrqe9Kn/lCkA4ybXt8sx5ojDqZjr2i0TWAHxx/vhgfjX+i3hCdKWufxYwi7CfXqtITSA==",
+            "optional": true,
+            "engines": {
+                "node": ">= 10"
+            },
+            "optionalDependencies": {
+                "@napi-rs/canvas-android-arm64": "0.1.70",
+                "@napi-rs/canvas-darwin-arm64": "0.1.70",
+                "@napi-rs/canvas-darwin-x64": "0.1.70",
+                "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.70",
+                "@napi-rs/canvas-linux-arm64-gnu": "0.1.70",
+                "@napi-rs/canvas-linux-arm64-musl": "0.1.70",
+                "@napi-rs/canvas-linux-riscv64-gnu": "0.1.70",
+                "@napi-rs/canvas-linux-x64-gnu": "0.1.70",
+                "@napi-rs/canvas-linux-x64-musl": "0.1.70",
+                "@napi-rs/canvas-win32-x64-msvc": "0.1.70"
+            }
+        },
+        "node_modules/@napi-rs/canvas-android-arm64": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.70.tgz",
+            "integrity": "sha512-I/YOuQ0wbkVYxVaYtCgN42WKTYxNqFA0gTcTrHIGG1jfpDSyZWII/uHcjOo4nzd19io6Y4+/BqP8E5hJgf9OmQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "android"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-darwin-arm64": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.70.tgz",
+            "integrity": "sha512-4pPGyXetHIHkw2TOJHujt3mkCP8LdDu8+CT15ld9Id39c752RcI0amDHSuMLMQfAjvusA9B5kKxazwjMGjEJpQ==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-darwin-x64": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.70.tgz",
+            "integrity": "sha512-+2N6Os9LbkmDMHL+raknrUcLQhsXzc5CSXRbXws9C3pv/mjHRVszQ9dhFUUe9FjfPhCJznO6USVdwOtu7pOrzQ==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "darwin"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-linux-arm-gnueabihf": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.70.tgz",
+            "integrity": "sha512-QjscX9OaKq/990sVhSMj581xuqLgiaPVMjjYvWaCmAJRkNQ004QfoSMEm3FoTqM4DRoquP8jvuEXScVJsc1rqQ==",
+            "cpu": [
+                "arm"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-linux-arm64-gnu": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.70.tgz",
+            "integrity": "sha512-LNakMOwwqwiHIwMpnMAbFRczQMQ7TkkMyATqFCOtUJNlE6LPP/QiUj/mlFrNbUn/hctqShJ60gWEb52ZTALbVw==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-linux-arm64-musl": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.70.tgz",
+            "integrity": "sha512-wBTOllEYNfJCHOdZj9v8gLzZ4oY3oyPX8MSRvaxPm/s7RfEXxCyZ8OhJ5xAyicsDdbE5YBZqdmaaeP5+xKxvtg==",
+            "cpu": [
+                "arm64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-linux-riscv64-gnu": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.70.tgz",
+            "integrity": "sha512-GVUUPC8TuuFqHip0rxHkUqArQnlzmlXmTEBuXAWdgCv85zTCFH8nOHk/YCF5yo0Z2eOm8nOi90aWs0leJ4OE5Q==",
+            "cpu": [
+                "riscv64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-linux-x64-gnu": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.70.tgz",
+            "integrity": "sha512-/kvUa2lZRwGNyfznSn5t1ShWJnr/m5acSlhTV3eXECafObjl0VBuA1HJw0QrilLpb4Fe0VLywkpD1NsMoVDROQ==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-linux-x64-musl": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.70.tgz",
+            "integrity": "sha512-aqlv8MLpycoMKRmds7JWCfVwNf1fiZxaU7JwJs9/ExjTD8lX2KjsO7CTeAj5Cl4aEuzxUWbJPUUE2Qu9cZ1vfg==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "linux"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
+        "node_modules/@napi-rs/canvas-win32-x64-msvc": {
+            "version": "0.1.70",
+            "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.70.tgz",
+            "integrity": "sha512-Q9QU3WIpwBTVHk4cPfBjGHGU4U0llQYRXgJtFtYqqGNEOKVN4OT6PQ+ve63xwIPODMpZ0HHyj/KLGc9CWc3EtQ==",
+            "cpu": [
+                "x64"
+            ],
+            "optional": true,
+            "os": [
+                "win32"
+            ],
+            "engines": {
+                "node": ">= 10"
+            }
+        },
        "node_modules/@rollup/rollup-android-arm-eabi": {
            "version": "4.34.8",
            "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.34.8.tgz",
@@ -1890,6 +2062,17 @@
            "resolved": "https://registry.npmjs.org/parchment/-/parchment-3.0.0.tgz",
            "integrity": "sha512-HUrJFQ/StvgmXRcQ1ftY6VEZUq3jA2t9ncFN4F84J/vN0/FPpQF+8FKXb3l6fLces6q0uOHj6NJn+2xvZnxO6A=="
        },
+        "node_modules/pdfjs-dist": {
+            "version": "5.2.133",
+            "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-5.2.133.tgz",
+            "integrity": "sha512-abE6ZWDxztt+gGFzfm4bX2ggfxUk9wsDEoFzIJm9LozaY3JdXR7jyLK4Bjs+XLXplCduuWS1wGhPC4tgTn/kzg==",
+            "engines": {
+                "node": ">=20.16.0 || >=22.3.0"
+            },
+            "optionalDependencies": {
+                "@napi-rs/canvas": "^0.1.67"
+            }
+        },
        "node_modules/picocolors": {
            "version": "1.1.1",
            "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
--- a/package.json
+++ b/package.json
@@ -13,6 +13,7 @@
        "axios": "^1.7.4",
        "concurrently": "^9.0.1",
        "laravel-vite-plugin": "^1.0",
+        "pdfjs-dist": "^5.2.133",
        "quill": "^2.0.3",
        "tailwindcss": "^4.0.7",
        "vite": "^6.0"
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -83,3 +83,20 @@ select:focus[data-flux-control] {
 .btn-primary {
    @apply inline-flex items-center px-4 py-2 bg-blue-600 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-blue-700 active:bg-blue-900 focus:outline-none focus:border-blue-900 focus:ring focus:ring-blue-300 disabled:opacity-25 transition;
 }
+
+.modal-enter {
+    opacity: 0;
+}
+.modal-enter-active {
+    opacity: 1;
+    transition: opacity 200ms;
+}
+.modal-exit {
+    opacity: 1;
+}
+.modal-exit-active {
+    opacity: 0;
+    transition: opacity 200ms;
+}
+
+
--- a/resources/views/components/app-logo.blade.php
+++ b/resources/views/components/app-logo.blade.php
@@ -2,5 +2,5 @@
    <x-app-logo-icon class="size-5 fill-current text-white dark:text-black" />
 </div>
 <div class="ms-1 grid flex-1 text-start text-sm">
-    <span class="mb-0.5 truncate leading-none font-semibold">Laravel Starter Kit</span>
+    <span class="mb-0.5 truncate leading-none font-semibold">{{ config('app.name') }}</span>
 </div>
--- a/resources/views/components/comment-item.blade.php
+++ b/resources/views/components/comment-item.blade.php
@@ -0,0 +1,23 @@
+@props(['comment', 'document'])
+
+<div class="border-l-2 border-blue-200 pl-3 ml-2" style="margin-left: {{ $comment->depth * 20 }}px">
+    <div class="flex items-start space-x-2">
+        <div class="flex-1">
+            <div class="text-sm font-medium">{{ $comment->user->name }}</div>
+            <div class="text-gray-600 text-sm">{{ $comment->created_at->diffForHumans() }}</div>
+            <p class="mt-1 text-gray-800">{{ $comment->content }}</p>
+            <div class="mt-1 text-xs text-blue-600 cursor-pointer hover:underline"
+                 @click="window.PDFViewer.scrollToComment({{ $comment->page }}, {{ $comment->x }}, {{ $comment->y }})">
+                Página {{ $comment->page }} - ({{ number_format($comment->x*100, 1) }}%, {{ number_format($comment->y*100, 1) }}%)
+            </div>
+        </div>
+    </div>
+    
+    @if($comment->children->isNotEmpty())
+        <div class="mt-2 space-y-2">
+            @foreach($comment->children as $child)
+                <x-comment-item :comment="$child" :document="$document" />
+            @endforeach
+        </div>
+    @endif
+</div>
--- a/resources/views/components/folder-item.blade.php
+++ b/resources/views/components/folder-item.blade.php
@@ -7,12 +7,12 @@
            <button wire:click.prevent="toggleFolder({{ $folder->id }})" 
                    class="mr-2">
                @if(in_array($folder->id, $expandedFolders))
-                    <x-icons.chevron-down class="w-4 h-4" />
+                    <x-icons icon="chevron-down" class="w-4 h-4" />
                @else
-                    <x-icons.chevron-right class="w-4 h-4" />
+                    <x-icons icon="chevron-right" class="w-4 h-4" />
                @endif
            </button>
-            <x-icons.folder class="w-5 h-5 mr-2 text-yellow-500" />
+            <x-icons icon="folder" class="w-5 h-5 mr-2 text-yellow-500" />
            <span>{{ $folder->name }}</span>
        </div>
    </div>
--- a/resources/views/components/folder-tree.blade.php
+++ b/resources/views/components/folder-tree.blade.php
@@ -5,12 +5,12 @@
        <div class="flex items-center flex-1" wire:click="selectFolder({{ $folder->id }})">
            <button wire:click.prevent="toggleFolder({{ $folder->id }})" class="mr-2">
                @if(in_array($folder->id, $expandedFolders))
-                    <x-icons.chevron-down class="w-4 h-4 text-gray-400" />
+                    <x-icons icon="chevron-down" class="w-4 h-4 text-gray-400" />
                @else
-                    <x-icons.chevron-right class="w-4 h-4 text-gray-400" />
+                    <x-icons icon="chevron-right" class="w-4 h-4 text-gray-400" />
                @endif
            </button>
-            <x-icons.folder class="w-5 h-5 mr-2 text-yellow-500" />
+            <x-icons icon="folder" class="w-5 h-5 mr-2 text-yellow-500" />
            <span class="cursor-pointer">{{ $folder->name }}</span>
        </div>
        <span class="text-sm text-gray-500">
--- a/resources/views/components/icons.blade.php
+++ b/resources/views/components/icons.blade.php
@@ -25,6 +25,12 @@
    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
 </svg>

+@elseif($icon === 'chevron-right')
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
+    <path stroke-linecap="round" stroke-linejoin="round" d="m8.25 4.5 7.5 7.5-7.5 7.5" />
+  </svg>
+  
+
@elseif($icon === 'user')
 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" {{ $attributes }}>
    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
--- a/resources/views/components/icons/excel.blade.php
+++ b/resources/views/components/icons/excel.blade.php
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="{{ $class }}" viewBox="0 0 32 32">
+    <path fill="#217346" d="M28.901 8.319l-5.223-5.223c-.379-.379-.868-.558-1.364-.595h-14.314v3.5h13.5v6h-13.5v3.5h13.5v6h-13.5v3.5h14.5c.828 0 1.5-.672 1.5-1.5v-22c0-.496-.217-.985-.603-1.364zm-5.598-3.776l3.181 3.181h-3.181v-3.181zm-16.303 25.457v-25.5h8.5v6h6v19.5h-14.5z"/>
+    <path fill="#fff" d="M20.1 15.3l-2.1-3.4-2.1 3.4h-1.5l2.6-4.2-2.5-4.1h1.5l1.9 3.2 1.9-3.2h1.5l-2.5 4.1 2.6 4.2z"/>
+  </svg>
--- a/resources/views/components/icons/pdf.blade.php
+++ b/resources/views/components/icons/pdf.blade.php
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill: rgba(0, 0, 0, 1);transform: ;msFilter:;"><path d="M8.267 14.68c-.184 0-.308.018-.372.036v1.178c.076.018.171.023.302.023.479 0 .774-.242.774-.651 0-.366-.254-.586-.704-.586zm3.487.012c-.2 0-.33.018-.407.036v2.61c.077.018.201.018.313.018.817.006 1.349-.444 1.349-1.396.006-.83-.479-1.268-1.255-1.268z"></path><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zM9.498 16.19c-.309.29-.765.42-1.296.42a2.23 2.23 0 0 1-.308-.018v1.426H7v-3.936A7.558 7.558 0 0 1 8.219 14c.557 0 .953.106 1.22.319.254.202.426.533.426.923-.001.392-.131.723-.367.948zm3.807 1.355c-.42.349-1.059.515-1.84.515-.468 0-.799-.03-1.024-.06v-3.917A7.947 7.947 0 0 1 11.66 14c.757 0 1.249.136 1.633.426.415.308.675.799.675 1.504 0 .763-.279 1.29-.663 1.615zM17 14.77h-1.532v.911H16.9v.734h-1.432v1.604h-.906V14.03H17v.74zM14 9h-1V4l5 5h-4z"></path></svg>
--- a/resources/views/components/layouts/app.blade.php
+++ b/resources/views/components/layouts/app.blade.php
@@ -1,5 +1,5 @@
-<x-layouts.app.sidebar :title="$title ?? null">
+<x-layouts.app.header :title="$title ?? null">
    <flux:main>
        {{ $slot }}
    </flux:main>
-</x-layouts.app.sidebar>
+</x-layouts.app.header>
--- a/resources/views/components/layouts/app/header.blade.php
+++ b/resources/views/components/layouts/app/header.blade.php
@@ -17,6 +17,12 @@
                </flux:navbar.item>
            </flux:navbar>
            
+            <flux:navbar class="-mb-px max-lg:hidden">
+                <flux:navbar.item icon="layout-grid" :href="route('dashboard')" :current="request()->routeIs('dashboard')" wire:navigate>
+                    {{ __('User') }}
+                </flux:navbar.item>
+            </flux:navbar>
+
            <flux:spacer />

            <flux:navbar class="me-1.5 space-x-0.5 rtl:space-x-reverse py-0!">
--- a/resources/views/components/layouts/documents.blade.php
+++ b/resources/views/components/layouts/documents.blade.php
@@ -0,0 +1,6 @@
+<x-layouts.app.header :title="$title ?? null">
+    <flux:main>
+        documents layout
+        {{ $slot }}
+    </flux:main>
+</x-layouts.app.header>
--- a/resources/views/components/layouts/livewire-app.blade.php.back
+++ b/resources/views/components/layouts/livewire-app.blade.php.back
--- a/resources/views/components/property-item.blade.php
+++ b/resources/views/components/property-item.blade.php
@@ -0,0 +1,6 @@
+@props(['label', 'value'])
+
+<div class="flex justify-between items-center border-b border-gray-100 pb-2">
+    <span class="text-sm text-gray-500">{{ $label }}:</span>
+    <span class="text-sm font-medium text-gray-900">{{ $value }}</span>
+</div>
--- a/resources/views/components/tab-button.blade.php
+++ b/resources/views/components/tab-button.blade.php
@@ -0,0 +1,11 @@
+@props(['active' => false])
+
+<button 
+    {{ $attributes->merge([
+        'class' => $active 
+            ? 'border-b-2 border-blue-500 text-blue-600 px-4 py-2 text-sm font-medium' 
+            : 'text-gray-500 hover:text-gray-700 hover:border-gray-300 px-4 py-2 text-sm font-medium border-b-2 border-transparent'
+    ]) }}
+>
+    {{ $slot }}
+</button>
--- a/resources/views/components/tab-content.blade.php
+++ b/resources/views/components/tab-content.blade.php
@@ -0,0 +1,5 @@
+@props(['show' => false])
+
+<div x-show="activeTab === '{{ $show }}'" class="space-y-4">
+    {{ $slot }}
+</div>
--- a/resources/views/components/version-item.blade.php
+++ b/resources/views/components/version-item.blade.php
--- a/resources/views/dashboard.blade.php
+++ b/resources/views/dashboard.blade.php
@@ -28,8 +28,10 @@
                        <x-icons icon="document" class="w-5 h-5 mr-3" />
                        Documentos
                    </x-nav-link>
+
                    @can('view roles')
                        <x-nav-link :href="route('roles.index')" :active="request()->routeIs('roles.*')">
+                            <x-icons icon="roles" class="w-5 h-5 mr-3" />
                            {{ __('Roles') }}
                        </x-nav-link>
                    @endcan
@@ -168,7 +170,7 @@
                                    <x-icons icon="storage" class="w-12 h-12 text-purple-500" />
                                </div>
                                <div class="w-full bg-gray-200 rounded-full h-2">
-                                    div class="bg-purple-500 rounded-full h-2" 
+                                    <div class="bg-purple-500 rounded-full h-2" 
                                        style="width: {{ $stats['storage_percentage'] }}%"></div>
                                </div>
                            </div>
--- a/resources/views/documents/show.blade.php
+++ b/resources/views/documents/show.blade.php
@@ -0,0 +1,288 @@
+<x-layouts.app :title="__('Show document')">
+    <div class="flex h-screen bg-gray-100" 
+        @resize.window.debounce="renderPage(currentPage)">
+
+        <!-- Zona izquierda - Visualizador de documentos -->
+        <div class="w-1/2 bg-gray-800 p-4 relative">
+            <!-- Loading State -->
+            <template x-if="loading">
+                <div class="absolute inset-0 bg-white bg-opacity-90 flex items-center justify-center">
+                    <div class="text-center">
+                        <svg class="animate-spin h-12 w-12 text-blue-500 mx-auto mb-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                        </svg>
+                        <p class="text-gray-600">Cargando documento...</p>
+                    </div>
+                </div>
+            </template>
+
+            <!-- Error State -->
+            <template x-if="error">
+                <div class="absolute inset-0 bg-red-50 flex items-center justify-center p-4">
+                    <div class="text-center text-red-600">
+                        <svg class="h-12 w-12 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
+                        </svg>
+                        <p x-text="error"></p>
+                        <p class="mt-2 text-sm">URL del documento: <span class="break-all" x-text="pdfUrl"></span></p>
+                    </div>
+                </div>
+            </template>
+            
+            <!-- Controles del PDF -->
+            <div class="flex items-center justify-between mb-4 bg-gray-700 p-2 rounded">
+                <div class="flex items-center space-x-4 text-white">
+                    <button @click="previousPage" :disabled="currentPage <= 1" class="disabled:opacity-50">
+                        <x-icons icon="chevron-left" class="w-6 h-6" />
+                    </button>
+                    <span>Página <span x-text="currentPage"></span> de <span x-text="totalPages"></span></span>
+                    <button @click="nextPage" :disabled="currentPage >= totalPages" class="disabled:opacity-50">
+                        <x-icons icon="chevron-right" class="w-6 h-6" />
+                    </button>
+                </div>
+                <div class="text-white">
+                    Zoom: 
+                    <select x-model="scale" @change="renderPage(currentPage)" class="bg-gray-600 rounded px-2 py-1">
+                        <option value="0.25">25%</option>
+                        <option value="0.5">50%</option>
+                        <option value="0.75">75%</option>
+                        <option value="1">100%</option>
+                        <option value="1.5">150%</option>
+                        <option value="2">200%</option>
+                    </select>
+                </div>
+            </div>
+
+            <!-- Canvas del PDF con comentarios -->
+            <div class="relative" id="pdf-container">
+                <canvas 
+                    id="pdf-canvas" 
+                    class="mx-auto shadow-lg bg-white"
+                    @click="handleCanvasClick($event)"
+                ></canvas>
+                
+                <!-- Marcadores de comentarios existentes -->
+                <template x-for="comment in comments" :key="comment.id">
+                    <div 
+                        class="absolute w-4 h-4 bg-yellow-400 rounded-full cursor-pointer border-2 border-yellow-600"
+                        :style="`left: ${comment.x * 100}%; top: ${comment.y * 100}%;`"
+                        @click="scrollToComment(comment)"
+                        x-tooltip="'Ver comentario'"
+                    ></div>
+                </template>
+                
+                <!-- Formulario flotante para nuevos comentarios -->
+                <div 
+                    class="absolute bg-white p-4 rounded-lg shadow-xl w-64" 
+                    x-show="showCommentForm"
+                    :style="`top: ${clickY}px; left: ${clickX}px`"
+                    @click.outside="closeCommentForm"
+                >
+                    <form @submit.prevent="submitComment">
+                        <textarea 
+                            x-model="commentText"
+                            class="w-full mb-2 p-2 border rounded"
+                            placeholder="Escribe tu comentario..."
+                            rows="3"
+                            required
+                        ></textarea>
+                        <button 
+                            type="submit"
+                            class="btn btn-primary w-full flex items-center justify-center"
+                        >
+                            <x-icons icon="save" class="w-4 h-4 mr-2" /> Guardar
+                        </button>
+                    </form>
+                </div>
+            </div>
+        </div>
+
+        <!-- Zona derecha - Tabs de información -->
+        <div x-data="{ activeTab: 'properties' }" class="w-1/2 flex flex-col bg-white">
+            <!-- Tabs de navegación -->
+            <div class="border-b border-gray-200">
+                <nav class="flex space-x-4 px-4 pt-2">
+                    <button @click="activeTab = 'properties'" 
+                        :class="activeTab === 'properties' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                        class="py-4 px-1 border-b-2 font-medium">
+                        Propiedades
+                    </button>
+                    <button @click="activeTab = 'security'" 
+                        :class="activeTab === 'security' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                        class="py-4 px-1 border-b-2 font-medium">
+                        Seguridad
+                    </button>
+                    <button @click="activeTab = 'comments'" 
+                        :class="activeTab === 'comments'  ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                        class="py-4 px-1 border-b-2 font-medium">
+                        Comentarios
+                    </button>
+                    <button @click="activeTab = 'history'" 
+                        :class="activeTab === 'history' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                        class="py-4 px-1 border-b-2 font-medium">
+                        Historial
+                    </button>
+                    <button @click="activeTab = 'relations'" 
+                        :class="activeTab === 'relations' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                        class="py-4 px-1 border-b-2 font-medium">
+                        Relaciones
+                    </button>
+                </nav>
+            </div>
+
+            <!-- Contenido de los tabs -->
+            <div class="flex-1 overflow-y-auto p-4 space-y-6">
+                <!-- Propiedades -->
+                <div x-show="activeTab === 'properties'">
+                    <div class="space-y-4">
+                        <x-property-item label="Nombre" :value="$document->name" />
+                        <x-property-item label="Tipo" :value="$document->type" />
+                        <x-property-item label="Tamaño" :value="$document->size_for_humans" />
+                        <x-property-item label="Creado por" :value="Storage::url($document->file_path)" />
+                        <x-property-item label="Fecha creación" :value="$document->created_at->format('d/m/Y H:i')" />
+                        <x-property-item label="Última modificación" :value="$document->updated_at->format('d/m/Y H:i')" />
+                    </div>
+                </div>
+
+                <!-- Seguridad -->
+                <div x-show="activeTab === 'security'" x-cloak>
+                    implementar
+                </div>
+
+                <!-- Comentarios -->
+                <div x-show="activeTab === 'comments'" x-cloak>
+                    <template x-for="comment in comments" :key="comment.id">
+                        <div class="p-4 mb-2 border rounded hover:bg-gray-50">
+                            <div class="text-sm text-gray-500" 
+                                 x-text="`Página ${comment.page} - ${new Date(comment.created_at).toLocaleString()}`"></div>
+                            <div x-text="comment.text" class="mt-1"></div>
+                        </div>
+                    </template>
+                </div>
+
+                <!-- Historial -->
+                <div x-show="activeTab === 'history'" x-cloak>
+                    <div class="space-y-4">
+                        @foreach($document->versions as $version)
+                            <x-version-item :version="$version" />
+                        @endforeach
+                    </div>
+                </div>
+
+                <!-- Relaciones -->
+                <div x-show="activeTab === 'relations'" x-cloak>
+                    implementar
+                </div>
+            </div>
+        </div>
+    </div>
+</x-layouts.app>
+
+
+<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.min.js"></script>
+<script>
+    // Configuración del Visor PDF
+    var currentPage = 1;
+    var nextPage = 2;
+
+    const url = "{{ Storage::url($document->file_path) }}";
+    let pdfDoc = null,
+        pageNum = 1,
+        pageRendering = false,
+        pageNumPending = null,
+        scale = 0.8,
+        canvas = document.getElementById('pdf-canvas');
+        ctx = canvas.getContext('2d');
+
+    function renderPage(num) {
+        pageRendering = true;
+        pdfDoc.getPage(num).then(function(page) {
+            const viewport = page.getViewport({ scale: 1.5 });
+            canvas.height = viewport.height;
+            canvas.width = viewport.width;
+
+            const renderContext = {
+                canvasContext: ctx,
+                viewport: viewport
+            };
+            
+            page.render(renderContext).promise.then(() => {
+                pageRendering = false;
+                loadCommentsForPage(num);
+            });
+
+            // Wait for rendering to finish
+            renderTask.promise.then(function() {
+                pageRendering = false;
+                if (pageNumPending !== null) {
+                    // New page rendering is pending
+                    renderPage(pageNumPending);
+                    pageNumPending = null;
+                }
+            });
+        });
+    }
+
+    function handleCanvasClick(event) {
+            const rect = event.target.getBoundingClientRect();
+            this.clickX = event.clientX - rect.left;
+            this.clickY = event.clientY - rect.top;
+            this.showCommentForm = true;
+        }
+
+    // Cargar PDF
+    pdfjsLib.getDocument(url).promise.then(function(pdf) {
+        pdfDoc = pdf;
+        renderPage(pageNum);
+    });
+
+    
+    /**
+     * If another page rendering in progress, waits until the rendering is
+     * finised. Otherwise, executes rendering immediately.
+     */
+    function queueRenderPage(num) {
+    if (pageRendering) {
+        pageNumPending = num;
+    } else {
+        renderPage(num);
+    }
+    }
+
+    /**
+     * Displays previous page.
+     */
+    function onPrevPage() {
+    if (pageNum <= 1) {
+        return;
+    }
+    pageNum--;
+    queueRenderPage(pageNum);
+    }
+    document.getElementById('prev').addEventListener('click', onPrevPage);
+
+    /**
+     * Displays next page.
+     */
+    function onNextPage() {
+    if (pageNum >= pdfDoc.numPages) {
+        return;
+    }
+    pageNum++;
+    queueRenderPage(pageNum);
+    }
+    document.getElementById('next').addEventListener('click', onNextPage);
+
+    /**
+     * Asynchronously downloads PDF.
+     */
+    pdfjsLib.getDocument(url).promise.then(function(pdfDoc_) {
+    pdfDoc = pdfDoc_;
+    document.getElementById('page_count').textContent = pdfDoc.numPages;
+
+    // Initial/first page rendering
+    renderPage(pageNum);
+    });
+
+</script>
--- a/resources/views/livewire/country-select.blade.php
+++ b/resources/views/livewire/country-select.blade.php
@@ -0,0 +1,63 @@
+<!-- resources/views/livewire/country-select.blade.php -->
+<div 
+    x-data="{ open: @entangle('isOpen') }" 
+    x-on:click.away="open = false"
+    class="relative"
+>
+    <!-- Botón que activa el desplegable -->
+    <button 
+        x-on:click="open = !open; $nextTick(() => { $refs.searchInput.focus() })"
+        type="button"
+        class="flex items-center justify-between w-[300px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none"
+    >
+        <span>
+            @if($selectedCountry && array_key_exists($selectedCountry, config('countries')))
+                {{ $this->formattedCountry($selectedCountry, config("countries.$selectedCountry")) }}
+            @else
+                Seleccione un país
+            @endif
+        </span>
+        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
+        </svg>
+    </button>
+    
+    <!-- Desplegable -->
+    <div 
+        x-show="open"
+        x-transition
+        class="absolute z-10 w-full mt-1 bg-white border rounded-md shadow-lg"
+    >
+        <!-- Input de búsqueda dentro del desplegable -->
+        <div class="p-2 border-b">
+            <input
+                type="text"
+                wire:model.debounce.300ms="search"
+                placeholder="Buscar país..."
+                class="w-full p-2 border rounded-md"
+                x-ref="searchInput"
+                x-on:click.stop
+            >
+        </div>
+        
+        <!-- Lista de países -->
+        <div class="overflow-y-auto max-h-60">
+            @forelse($countries as $code => $name)
+                <button
+                    type="button"
+                    wire:click="selectCountry('{{ $code }}')"
+                    class="flex items-center w-full px-4 py-2 text-left hover:bg-gray-100"
+                >
+                    {{ $this->formattedCountry($code, $name) }}
+                </button>
+            @empty
+                <div class="px-4 py-2 text-gray-500">
+                    No se encontraron resultados
+                </div>
+            @endforelse
+        </div>
+    </div>
+    
+    <!-- Input hidden para el formulario -->
+    <input type="hidden" name="country" value="{{ $selectedCountry }}">
+</div>
--- a/resources/views/livewire/image-uploader.blade.php
+++ b/resources/views/livewire/image-uploader.blade.php
@@ -0,0 +1,57 @@
+<div x-data="{ isUploading: false }"
+     x-on:livewire-upload-start="isUploading = true"
+     x-on:livewire-upload-finish="isUploading = false"
+     x-on:livewire-upload-error="isUploading = false">
+    
+    <div class="form-group">
+        <label>{{ $label }}</label>
+        
+        <!-- Zona de dropzone modificada -->
+        <div wire:ignore
+             x-on:drop.prevent="
+                const files = event.dataTransfer.files;
+                if (files.length) {
+                    @this.upload('image', files[0]);
+                }
+                $wire.toggleHover(false);
+                event.stopPropagation(); // Evita propagación del evento
+             "
+             x-on:dragover.prevent="$wire.toggleHover(true)"
+             x-on:dragleave.prevent="$wire.toggleHover(false)"
+             class="dropzone {{ $hover ? 'dropzone-hover' : '' }} mb-3 p-4 border-2 border-dashed rounded text-center cursor-pointer">
+            
+            <!-- Contenido modificado -->
+            <div wire:loading wire:target="image" class="text-center py-4">
+                <div class="spinner-border text-primary" role="status">
+                    <span class="visually-hidden">Cargando...</span>
+                </div>
+                <p>Subiendo imagen...</p>
+            </div>
+            
+            <div wire:loading.remove wire:target="image">
+                @if(!$imagePath && !$image)
+                    <i class="fas fa-cloud-upload-alt fa-3x mb-2 text-muted"></i>
+                    <p class="mb-1">Arrastra y suelta tu imagen aquí</p>
+                    <p class="text-muted small">o haz clic para seleccionar</p>
+                    <!-- Input file modificado -->
+                    <input type="file" 
+                           wire:model="image" 
+                           class="d-none" 
+                           id="fileInput"
+                           x-on:change="$wire.uploadImage(); event.stopPropagation();">
+                    <button type="button" 
+                            class="btn btn-sm btn-outline-primary mt-2" 
+                            onclick="document.getElementById('fileInput').click()">
+                        Seleccionar archivo
+                    </button>
+                @endif
+                
+                <!-- Resto del contenido se mantiene igual -->
+            </div>
+        </div>
+        
+        @error('image') 
+            <div class="alert alert-danger mt-2">{{ $message }}</div>
+        @enderror
+    </div>
+</div>
--- a/resources/views/livewire/project-show.blade.php
+++ b/resources/views/livewire/project-show.blade.php
@@ -1,118 +0,0 @@
-<div>
-    <!-- Header y Breadcrumbs -->
-    <div class="p-4 bg-white border-b">
-        <div class="flex items-center justify-between">
-            <div>
-                <nav class="flex space-x-2 text-sm">
-                    <a wire:click="currentFolder = null" class="cursor-pointer text-gray-600 hover:text-blue-600">
-                        Inicio
-                    </a>
-                    @foreach($this->breadcrumbs as $folder)
-                    <span class="text-gray-400">/</span>
-                    <a wire:click="selectFolder({{ $folder->id }})" 
-                       class="cursor-pointer text-gray-600 hover:text-blue-600">
-                        {{ $folder->name }}
-                    </a>
-                    @endforeach
-                </nav>
-                <h1 class="mt-2 text-2xl font-bold">{{ $project->name }}</h1>
-            </div>
-            <a href="{{ route('projects.edit', $project) }}" 
-               class="px-4 py-2 text-white bg-blue-600 rounded-lg hover:bg-blue-700">
-                Editar Proyecto
-            </a>
-        </div>
-    </div>
-
-    <!-- Barra de Herramientas y Contenido -->
-    <div class="grid grid-cols-1 gap-6 p-4 lg:grid-cols-4">
-        <!-- Treeview de Carpetas -->
-        <div class="col-span-1 bg-white rounded-lg shadow">
-            <div class="p-4 border-b">
-                <div class="flex items-center justify-between">
-                    <h3 class="font-medium">Carpetas</h3>
-                    <button wire:click="createFolder" 
-                            class="p-1 text-gray-600 hover:bg-gray-100 rounded">
-                        <x-icons icon="plus" class="w-5 h-5" />
-                    </button>
-                </div>
-                <input type="text" 
-                       wire:model.live="folderName"
-                       placeholder="Nueva carpeta"
-                       class="w-full p-2 mt-2 border rounded"
-                       @keyup.enter="createFolder">
-            </div>
-            <div class="p-4">
-                <ul class="space-y-2">
-                    @foreach($project->rootFolders as $folder)
-                    <x-folder-item 
-                        :folder="$folder"
-                        :currentFolder="$currentFolder"
-                        :expandedFolders="$expandedFolders"
-                        wire:key="folder-{{ $folder->id }}"
-                    />
-                    @endforeach
-                </ul>
-            </div>
-        </div>
-
-        <!-- Documentos y Subida de Archivos -->
-        <div class="col-span-3">
-            <div class="bg-white rounded-lg shadow">
-                <div class="p-4 border-b">
-                    <div class="flex items-center justify-between">
-                        <h3 class="font-medium">Documentos</h3>
-                        <input type="file" 
-                               wire:model="files"
-                               multiple
-                               class="hidden"
-                               id="file-upload">
-                        <label for="file-upload" 
-                               class="px-4 py-2 text-sm text-white bg-green-600 rounded-lg cursor-pointer hover:bg-green-700">
-                            Subir Archivos
-                        </label>
-                    </div>
-                </div>
-                <div class="overflow-x-auto">
-                    <table class="min-w-full divide-y divide-gray-200">
-                        <thead class="bg-gray-50">
-                            <tr>
-                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Nombre</th>
-                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Versiones</th>
-                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Última Actualización</th>
-                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Estado</th>
-                            </tr>
-                        </thead>
-                        <tbody class="bg-white divide-y divide-gray-200">
-                            @forelse($this->documents as $document)
-                            <tr class="hover:bg-gray-50">
-                                <td class="px-6 py-4 whitespace-nowrap">
-                                    <div class="flex items-center">
-                                        <x-icons icon="document" class="w-5 h-5 mr-2 text-gray-400" />
-                                        {{ $document->name }}
-                                    </div>
-                                </td>
-                                <td class="px-6 py-4 whitespace-nowrap">
-                                    {{ $document->versions_count }}
-                                </td>
-                                <td class="px-6 py-4 whitespace-nowrap">
-                                    {{ $document->updated_at->diffForHumans() }}
-                                </td>
-                                <td class="px-6 py-4 whitespace-nowrap">
-                                    <x-status-badge :status="$document->status" />
-                                </td>
-                            </tr>
-                            @empty
-                            <tr>
-                                <td colspan="4" class="px-6 py-4 text-center text-gray-500">
-                                    No se encontraron documentos
-                                </td>
-                            </tr>
-                            @endforelse
-                        </tbody>
-                    </table>
-                </div>
-            </div>
-        </div>
-    </div>
-</div>
--- a/resources/views/livewire/project/show.blade.php
+++ b/resources/views/livewire/project/show.blade.php
@@ -0,0 +1,283 @@
+<div>
+    <!-- Header y Breadcrumbs -->
+    <div class="p-4 bg-white border-b">
+        <div class="flex items-center justify-between">
+            <div>
+                <nav class="flex space-x-2 text-sm">
+                    <a wire:click="currentFolder = null" class="cursor-pointer text-gray-600 hover:text-blue-600">
+                        Inicio
+                    </a>
+                    @foreach($this->breadcrumbs as $folder)
+                    <span class="text-gray-400">/</span>
+                    <a wire:click="selectFolder({{ $folder->id }})" 
+                       class="cursor-pointer text-gray-600 hover:text-blue-600">
+                        {{ $folder->name }}
+                    </a>
+                    @endforeach
+                </nav>
+                <h1 class="mt-2 text-2xl font-bold">{{ $project->name }}</h1>
+            </div>
+            <a href="{{ route('projects.edit', $project) }}" 
+               class="px-4 py-2 text-white bg-blue-600 rounded-lg hover:bg-blue-700">
+                Editar Proyecto
+            </a>
+        </div>
+    </div>
+
+    <div wire:loading wire:target="files" class="fixed top-0 right-0 p-4 bg-blue-100 text-blue-800">
+        Subiendo archivos...
+    </div>
+
+    <!-- Contenedor principal con layout de explorador -->
+    <div class="flex flex-col h-full">
+        <!-- Barra de herramientas -->
+        <div class="flex items-center justify-between p-4 bg-white border-b">
+            <div class="flex items-center space-x-4">
+                <!-- Botón Nueva Carpeta -->
+                <button wire:click="showCreateFolderModal" class="flex items-center p-2 text-gray-600 hover:bg-gray-100 rounded">
+                    <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z" />
+                    </svg>
+                    <span class="text-sm">Nueva carpeta</span>
+                </button>
+                
+                <!-- Botón Subir Archivos (versión con button) -->
+                <div class="relative">
+                    <button 
+                        wire:click="openUploadModal"
+                        class="flex items-center p-2 text-gray-600 hover:bg-gray-100 rounded">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 mr-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
+                        </svg>
+                        <span class="text-sm">Subir archivos</span>
+                    </button>
+                </div>
+            </div>
+        </div>
+
+        <!-- Contenido principal (treeview + documentos) -->
+        <div class="flex flex-1 overflow-hidden">
+            <!-- Treeview de Carpetas -->
+            <div class="w-64 h-full overflow-y-auto border-r bg-white">
+                <div class="p-4">
+                    <ul class="space-y-1">
+                        @foreach($project->rootFolders as $folder)
+                        <x-folder-item 
+                            :folder="$folder"
+                            :currentFolder="$currentFolder"
+                            :expandedFolders="$expandedFolders"
+                            wire:key="folder-{{ $folder->id }}"
+                        />
+                        @endforeach
+                    </ul>
+                </div>
+            </div>
+
+            <!-- Documentos -->
+            <div class="flex-1 overflow-auto bg-white">
+                <div class="overflow-x-auto">
+                    <table class="min-w-full divide-y divide-gray-200">
+                        <thead class="bg-gray-50 sticky top-0">
+                            <tr>
+                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Nombre</th>
+                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Versiones</th>
+                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Última Actualización</th>
+                                <th class="px-6 py-3 text-xs font-medium tracking-wider text-left text-gray-500 uppercase">Estado</th>
+                            </tr>
+                        </thead>
+                        <tbody class="bg-white divide-y divide-gray-200">
+                            @forelse($this->documents as $document)
+                            <tr class="hover:bg-gray-50">
+                                <td class="px-6 py-4 whitespace-nowrap">
+                                    <div class="flex items-center">
+                                        <a href="{{ route('documents.show', $document) }}" 
+                                            target="_blank"
+                                            class="flex items-center hover:text-blue-600 transition-colors">
+                                            @php
+                                                $type = App\Helpers\FileHelper::getFileType($document->name);
+                                                $iconComponent = $iconComponent = "icons." . $type;
+                                                $iconClass = [
+                                                    'pdf' => 'pdf text-red-500',
+                                                    'word' => 'word text-blue-500',
+                                                    'excel' => 'excel text-green-500',
+                                                    // ... agregar todos los tipos
+                                                ][$type] ?? 'document text-gray-400';
+                                            @endphp
+                                            
+                                            <x-dynamic-component 
+                                                component="{{ $iconComponent }}" 
+                                                class="w-5 h-5 mr-2 {{ explode(' ', $iconClass)[1] }}"
+                                            />
+                                            
+                                            {{ $document->name }}
+                                        </a>
+                                    </div>
+                                </td>
+                                <td class="px-6 py-4 whitespace-nowrap">
+                                    {{ $document->versions_count }}
+                                </td>
+                                <td class="px-6 py-4 whitespace-nowrap">
+                                    {{ $document->updated_at->diffForHumans() }}
+                                </td>
+                                <td class="px-6 py-4 whitespace-nowrap">
+                                    <x-status-badge :status="$document->status" />
+                                </td>
+                            </tr>
+                            @empty
+                            <tr>
+                                <td colspan="4" class="px-6 py-4 text-center text-gray-500">
+                                    No se encontraron documentos en esta carpeta
+                                </td>
+                            </tr>
+                            @endforelse
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- Modal para crear carpeta -->
+    @if($showFolderModal)
+    <div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
+        <div class="w-full max-w-md p-6 bg-white rounded-lg shadow-xl">
+            <div class="mb-4">
+                <h3 class="text-lg font-medium text-gray-900">Crear nueva carpeta</h3>
+                <p class="mt-1 text-sm text-gray-500">Ingresa el nombre de la nueva carpeta</p>
+            </div>
+            
+            <div class="mb-4">
+                <input 
+                    type="text" 
+                    wire:model="folderName"
+                    placeholder="Nombre de la carpeta"
+                    class="w-full p-2 border rounded focus:ring-blue-500 focus:border-blue-500"
+                    autofocus
+                    @keyup.enter="createFolder"
+                >
+                @error('folderName')
+                    <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
+                @enderror
+            </div>
+            
+            <div class="flex justify-end space-x-3">
+                <button 
+                    wire:click="hideCreateFolderModal"
+                    class="px-4 py-2 text-sm text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50">
+                    Cancelar
+                </button>
+                <button 
+                    wire:click="createFolder"
+                    class="px-4 py-2 text-sm text-white bg-blue-600 rounded-md hover:bg-blue-700">
+                    Crear carpeta
+                </button>
+            </div>
+        </div>
+    </div>
+    @endif
+
+    <!-- Modal de subida -->
+    @if($showUploadModal)
+    <div 
+        x-data="{ isDragging: false }"
+        x-on:drop.prevent="isDragging = false; $wire.selectFiles(Array.from($event.dataTransfer.files))"
+        x-on:dragover.prevent="isDragging = true"
+        x-on:dragleave.prevent="isDragging = false"
+        class="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
+        
+        <div class="w-full max-w-2xl p-6 bg-white rounded-lg shadow-xl">
+            <div class="mb-4">
+                <h3 class="text-lg font-medium text-gray-900">Subir archivos</h3>
+                <p class="mt-1 text-sm text-gray-500">
+                    {{ $currentFolder ? "Carpeta destino: {$currentFolder->name}" : "Carpeta raíz del proyecto" }}
+                </p>
+            </div>
+
+            <!-- Área de drag & drop -->
+            <div 
+                x-on:click="$refs.fileInput.click()"
+                :class="isDragging ? 'border-blue-500 bg-blue-50' : 'border-gray-300'"
+                class="flex flex-col items-center justify-center p-8 border-2 border-dashed rounded-lg cursor-pointer hover:bg-gray-50 transition-colors">
+                <input 
+                    type="file" 
+                    x-ref="fileInput" 
+                    wire:model="selectedFiles"
+                    multiple 
+                    class="hidden"
+                    wire:change="selectFiles($event.target.files)">
+                
+                <svg xmlns="http://www.w3.org/2000/svg" class="w-12 h-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
+                </svg>
+                
+                <div class="mt-4 text-center">
+                    <p class="font-medium text-gray-900">
+                        Arrastra archivos aquí o haz clic para seleccionar
+                    </p>
+                    <p class="text-sm text-gray-500">
+                        Formatos soportados: PDF, DOCX, XLSX, JPG, PNG (Máx. 10MB)
+                    </p>
+                </div>
+            </div>
+
+            <!-- Lista de archivos -->
+            <div class="mt-4 max-h-64 overflow-y-auto">
+                @if(count($selectedFiles) > 0)
+                    <ul class="space-y-2">
+                        @foreach($selectedFiles as $index => $file)
+                            <li class="flex items-center justify-between p-2 bg-gray-50 rounded">
+                                <div class="flex items-center truncate">
+                                    <x-icons icon="document" class="w-4 h-4 mr-2 text-gray-400" />
+                                    <span class="text-sm truncate">
+                                        {{ $file->getClientOriginalName() }} <!-- Ahora funciona -->
+                                    </span>
+                                </div>
+                                
+                                <div class="flex items-center space-x-2">
+                                    <span class="text-xs text-gray-500">
+                                        {{ number_format($file->getSize() / 1024, 2) }} KB
+                                    </span>
+                                    <button 
+                                        wire:click="removeFile({{ $index }})"
+                                        type="button"
+                                        class="p-1 text-gray-400 hover:text-red-600">
+                                        ✕
+                                    </button>
+                                </div>
+                            </li>
+                        @endforeach
+                    </ul>
+                @endif
+            </div>
+
+            <!-- Footer del modal -->
+            <div class="flex justify-end mt-6 space-x-3">
+                <button 
+                    wire:click="resetUpload"
+                    type="button"
+                    class="px-4 py-2 text-sm text-gray-700 bg-white border border-gray-300 rounded-md hover:bg-gray-50">
+                    Cancelar
+                </button>
+                <button 
+                    wire:click="uploadFiles"
+                    :disabled="!selectedFiles.length"
+                    class="px-4 py-2 text-sm text-white bg-blue-600 rounded-md hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed">
+                    Subir archivos ({{ count($selectedFiles) }})
+                </button>
+            </div>
+        </div>
+    </div>
+    @endif
+</div>
+
+<script>
+    document.addEventListener('livewire:init', () => {
+        Livewire.on('upload-progress', (name, progress) => {
+            // Actualizar progreso en el frontend
+            const progressBar = document.querySelector(`[data-file="${name}"] .progress-bar`);
+            if (progressBar) {
+                progressBar.style.width = `${progress}%`;
+            }
+        });
+    });
+    </script>
--- a/resources/views/livewire/settings/profile.blade.php
+++ b/resources/views/livewire/settings/profile.blade.php
@@ -15,7 +15,7 @@ new class extends Component {
     */
    public function mount(): void
    {
-        $this->name = Auth::user()->name;
+        $this->name = Auth::user()->first_name;
        $this->email = Auth::user()->email;
    }

--- a/resources/views/livewire/user-photo-upload.blade.php
+++ b/resources/views/livewire/user-photo-upload.blade.php
@@ -0,0 +1,96 @@
+<!-- resources/views/livewire/user-photo-upload.blade.php -->
+
+<div class="mb-6" x-data="{ isUploading: false, previewUrl: '{{ $existingPhoto ? asset('storage/photos/'.$existingPhoto) : '' }}'}" }">
+    <!-- Foto existente -->
+    @if($existingPhoto)
+        <div class="mb-4 relative group">
+            <img src="{{ asset('storage/photos/' . $existingPhoto) }}" 
+                 alt="Foto actual" 
+                 class="w-32 h-32 rounded-full object-cover shadow-md">
+            
+            <button type="button" 
+                    wire:click="deletePhoto"
+                    class="absolute top-0 right-0 bg-red-500 text-white rounded-full p-1 opacity-0 group-hover:opacity-100 transition-opacity"
+                    title="Eliminar foto">
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
+                </svg>
+            </button>
+        </div>
+    @endif
+
+    <!-- Zona de carga -->
+    <div x-on:livewire-upload-start="isUploading = true"
+         x-on:livewire-upload-finish="isUploading = false"
+         x-on:livewire-upload-error="isUploading = false"
+         class="border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer hover:border-blue-500 transition-colors">
+         
+        <input type="file" 
+               wire:model="photo" 
+               id="photoInput"
+               class="hidden"
+               accept="image/*"
+               @if($existingPhoto) disabled @endif>
+        
+        <label for="photoInput" class="cursor-pointer">
+            <div class="space-y-2">
+                <svg class="mx-auto h-12 w-12 text-gray-400" 
+                     stroke="currentColor" 
+                     fill="none" 
+                     viewBox="0 0 48 48">
+                    <path d="M28 8H12a4 4 0 00-4 4v20m32-12v8m0 0v8a4 4 0 01-4 4H12a4 4 0 01-4-4v-4m32-4l-3.172-3.172a4 4 0 00-5.656 0L28 28M8 32l9.172-9.172a4 4 0 015.656 0L28 28m0 0l4 4m4-24h8m-4-4v8m-12 4h.02" 
+                          stroke-width="2" 
+                          stroke-linecap="round" 
+                          stroke-linejoin="round"/>
+                </svg>
+                
+                <div class="text-sm text-gray-600">
+                    <span class="font-medium text-blue-600">Sube una foto</span>
+                    o arrastra y suelta
+                </div>
+                <div class="text-xs text-gray-500">
+                    PNG, JPG, GIF hasta 2MB
+                </div>
+                
+                <!-- Vista previa temporal -->
+                @if($tempPhoto)
+                    <div class="mt-4">
+                        <img src="{{ $tempPhoto }}" 
+                             alt="Vista previa" 
+                             class="w-32 h-32 rounded-full object-cover mx-auto shadow-md">
+                    </div>
+                @endif
+                
+                <!-- Loading state -->
+                <div x-show="isUploading" class="mt-2">
+                    <div class="inline-flex items-center text-sm text-gray-500">
+                        <svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-blue-500" 
+                             xmlns="http://www.w3.org/2000/svg" 
+                             fill="none" 
+                             viewBox="0 0 24 24">
+                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
+                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                        </svg>
+                        Subiendo...
+                    </div>
+                </div>
+            </div>
+        </label>
+    </div>
+
+    <!-- Botones de acción -->
+    @if($photo || $tempPhoto)
+        <div class="mt-4 flex justify-center gap-2">
+            <button type="button" 
+                    wire:click="removePhoto"
+                    class="px-4 py-2 bg-red-100 text-red-700 rounded-md hover:bg-red-200 transition-colors">
+                Borrar
+            </button>
+        </div>
+    @endif
+
+    <!-- Mensajes de error -->
+    @error('photo')
+        <div class="mt-2 text-sm text-red-600">{{ $message }}</div>
+    @enderror
+</div>
--- a/resources/views/livewire/user-table.blade.php
+++ b/resources/views/livewire/user-table.blade.php
@@ -0,0 +1,193 @@
+<div>
+    <!-- Controles de columnas -->
+    <div class="mb-4 flex items-center gap-4">
+        <div class="relative" x-data="{ open: false }">
+            <button @click="open = !open" class="bg-gray-100 px-4 py-2 rounded-lg hover:bg-gray-200">
+                Columnas ▼
+            </button>
+            
+            <div x-show="open" @click.outside="open = false" 
+                 class="absolute bg-white shadow-lg rounded-lg p-4 mt-2 min-w-[200px] z-10">
+                @foreach($available_columns as $key => $label)
+                    <label class="flex items-center gap-2 mb-2">
+                        <input type="checkbox" wire:model.live="columns.{{ $key }}" 
+                               class="rounded border-gray-300">
+                        {{ $label }}
+                    </label>
+                @endforeach
+            </div>
+        </div>
+    </div>
+
+    <!-- Tabla -->
+    <div class="bg-white rounded-lg shadow overflow-x-auto">
+        <table class="min-w-full">
+            <thead class="bg-gray-50">
+                <tr>
+                    @foreach($available_columns as $key => $label)
+                        @if($columns[$key])
+                            @if($key !== 'is_active')
+                                <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase cursor-pointer" >
+                                    <div class="flex items-center justify-between">
+                                        <div class="flex flex-col">
+                                            <span wire:click="sortBy('{{ $key }}')">{{ $label }}</span>
+                                            <input type="text" 
+                                                wire:model.live.debounce.300ms="filters.{{ $key }}" 
+                                                class="mt-1 text-xs w-full border rounded px-2 py-1"
+                                                placeholder="Filtrar...">
+                                        </div>
+                                        @if($sortField === $key)
+                                            <span class="ml-2">
+                                                @if($sortDirection === 'asc')
+                                                    ↑
+                                                @else
+                                                    ↓
+                                                @endif
+                                            </span>
+                                        @endif
+                                    </div>
+                                </th>
+                            @else
+                            <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">
+                                <div class="flex flex-col">
+                                    <span>Estado</span>
+                                    <select wire:model.live="filters.status" class="mt-1 text-xs w-full border rounded px-2 py-1">
+                                        <option value="">Todos</option>
+                                        <option value="active">Activo</option>
+                                        <option value="inactive">Inactivo</option>
+                                    </select>
+                                </div>
+                            </th>
+                            @endif
+                        @endif
+                    @endforeach
+                    
+
+                    <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Acciones</th>
+                </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-200">
+                @foreach($users as $user)
+                    <tr>
+                        @if($columns['full_name'])
+                            <td class="px-6 py-4 whitespace-nowrap">
+                                <a href="{{ route('users.show', $user) }}" class="flex items-center hover:text-blue-600 hover:underline group">
+                                    <!-- Foto del usuario -->
+                                    @if($user->profile_photo_path)
+                                        <div class="mr-3 flex-shrink-0">
+                                            <img src="{{ asset('storage/' . $user->profile_photo_path) }}" 
+                                                 alt="{{ $user->full_name }}"
+                                                 class="w-8 h-8 rounded-full object-cover transition-transform group-hover:scale-110">
+                                        </div>
+                                    @else
+                                        <div class="w-8 h-8 rounded-full bg-gray-200 mr-3 flex items-center justify-center transition-colors group-hover:bg-blue-100">
+                                            <svg class="w-4 h-4 text-gray-500 group-hover:text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/>
+                                            </svg>
+                                        </div>
+                                    @endif
+                                    
+                                    <!-- Nombre completo con efecto hover -->
+                                    <span class="group-hover:text-blue-600 transition-colors">
+                                        {{ $user->full_name }}
+                                        @if(!$user->is_active)
+                                            <span class="text-xs text-red-500 ml-2">(Inactivo)</span>
+                                        @endif
+                                    </span>
+                                </a>
+                            </td>
+                        @endif
+                        
+                        <td class="px-6 py-4 whitespace-nowrap">
+                            @if($columns['username'])
+                                {{ $user->username }}
+                            @else
+                                N/A
+                            @endif
+                        </td>
+                        
+                        <td class="px-6 py-4 whitespace-nowrap">
+                            @if($columns['email'])
+                            
+                                <div class="flex items-center gap-2">
+                                    <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
+                                    </svg>
+                                    {{ $user->email }}
+                                </div>
+                            @else
+                                N/A
+                            @endif
+                        </td>
+
+                        <td class="px-6 py-4 whitespace-nowrap">
+                            @if($columns['phone'])
+                            
+                                <div class="flex items-center gap-2">
+                                    <svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                                    </svg>
+                                    {{ $user->phone ?? 'N/A' }}
+                                </div>
+                            @else
+                                N/A
+                            @endif
+                        </td>
+                        
+                        <td class="px-6 py-4 whitespace-nowrap">
+                            @if($columns['access_start'])
+                                {{ $user->access_start?->format('d/m/Y') }}
+                            @else
+                                N/A
+                            @endif
+                        </td>
+                        
+                        <td class="px-6 py-4 whitespace-nowrap">
+                            @if($columns['created_at'])
+                                {{ $user->created_at->format('d/m/Y H:i') }}
+                            @else
+                                N/A
+                            @endif
+                        </td>
+
+                        <td class="px-6 py-4 whitespace-nowrap">
+                            @if($columns['is_active'])
+                                {{ $user->is_active ? 'Activo' : 'Inactivo' }}
+                            @else
+                                N/A
+                            @endif
+                        </td>
+                        
+                        <td class="px-6 py-4 whitespace-nowrap">
+                                <!-- Acciones -->
+                                <div class="flex items-center gap-2">
+                                    <!-- Botón Editar -->
+                                    <a href="{{ route('users.edit', $user) }}" 
+                                    class="text-blue-600 hover:text-blue-900"
+                                    title="Editar usuario">
+                                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/>
+                                        </svg>
+                                    </a>
+                
+                                    <!-- Botón Eliminar -->
+                                    <button wire:click="confirmDelete({{ $user->id }})" 
+                                            class="text-red-600 hover:text-red-900"
+                                            title="Eliminar usuario">
+                                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
+                                        </svg>
+                                    </button>
+                                </div>
+                        </td>
+                    </tr>
+                @endforeach
+            </tbody>
+        </table>
+    </div>
+
+    <!-- Paginación -->
+    <div class="mt-4">
+        {{ $users->links() }}
+    </div>
+</div>
--- a/resources/views/projects/create.blade.php
+++ b/resources/views/projects/create.blade.php
@@ -1,34 +1,39 @@
 <!-- resources/views/projects/create.blade.php -->
+
 <x-layouts.app :title="__('Create Project')">
-    <x-slot name="header">
-        <h2 class="flex items-center gap-2 text-xl font-semibold leading-tight text-gray-800">
-            <!-- Icono (ejemplo con Heroicons) -->
-            <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
-            </svg>
-            
-            {{ __('Nuevo Proyecto') }}
-        </h2>
-    </x-slot>
-
+    <div class="max-w-4xl mx-auto px-0 py-4">
        <header class="bg-white shadow">
            <div class="px-4 py-6 mx-auto max-w-7xl sm:px-6 lg:px-8">
                <h2 class="flex items-center text-xl font-semibold leading-tight text-gray-800">
                    <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"/>
                    </svg>
+
                    {{ __('Nuevo Proyecto') }}
+                    
+                    @error('error')
+                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                    @enderror
+                    
                </h2>
            </div>
        </header>

-    <div class="py-6">
-        <div class="px-4 py-6 mx-auto max-w-7xl sm:px-6 lg:px-8">
-            <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
-                <div class="p-6 bg-white border-b border-gray-200">
+
        <form method="POST" action="{{ route('projects.store') }}" enctype="multipart/form-data">
            @csrf
            
+            <!-- Separador -->
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Datos Generales</span>
+                </div>
+            </div>
+
+            <div class="bg-white py-6">
                <table class="w-full mb-8">
                    <tbody>
                        <!-- Nombre -->
@@ -37,11 +42,12 @@
                                <x-label for="name" :value="__('Nombre del Proyecto')" />
                            </td>
                            <td class="py-3">
-                                        <x-input id="name" 
-                                            class="block w-[150px] mt-1 border-0 border-b border-gray-300 focus:ring-0 focus:border-blue-500" 
-                                            type="text" name="name" 
-                                            :value="old('name')" 
-                                            required />
+                                <input type="text" name="name" 
+                                    value="{{ old('name', $project->name ?? '') }}" 
+                                    class="w-[250px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none" 
+                                    autofocus
+                                    required>
+                                
                                @error('name')
                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
                                @enderror
@@ -63,35 +69,6 @@
                            </td>
                        </tr>
                
-                                <!-- Editor Enriquecido -->
-                                <tr>
-                                    <td class="w-1/4 py-3 pr-4 align-top">
-                                        <x-label for="description" :value="__('Descripción Detallada')" />
-                                    </td>
-                                    <td class="py-3">
-                                        <div id="editor-container">
-                                            <!-- Barra de herramientas -->
-                                            <div id="toolbar">
-                                                <button class="ql-bold"></button>
-                                                <button class="ql-italic"></button>
-                                                <button class="ql-underline"></button>
-                                                <button class="ql-strike"></button>
-                                                <button class="ql-blockquote"></button>
-                                                <button class="ql-code-block"></button>
-                                                <button class="ql-link"></button>
-                                                <button class="ql-image"></button>
-                                            </div>
-                                        
-                                            <!-- Editor -->
-                                            <input type="hidden" name="description">
-                                            <div id="rich-editor" class="h-48">{!! old('description') !!}</div>
-                                        </div>
-                                        @error('description')
-                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                        @enderror
-                                    </td>
-                                </tr>
-                        
                        <!-- Estado -->
                        <tr>
                            <td class="w-1/4 py-3 pr-4 align-top">
@@ -108,7 +85,149 @@
                            </td>
                        </tr>
                
+                        <!-- Fechas Importantes -->
+                        <tr>
+                            <td class="w-1/4 py-3 pr-4 align-top">
+                                <x-label for="start_date" :value="__('Fechas')" />
+                            </td>
+                            <td class="py-3">
+                                <div class="flex gap-4">
+                                    <span class="text-gray-700">de</span>
+                                    <input type="date" 
+                                            id="start_date"
+                                            name="start_date" 
+                                            value="{{ old('start_date') }}"
+                                            class="w-[150px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                    <span class="text-gray-700">a</span>
+                                    <input type="date" 
+                                            id="deadline" 
+                                            name="deadline" 
+                                            value="{{ old('end_date') }}"
+                                            class="w-[150px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                </div>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
            
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Ubicación	</span>
+                </div>
+            </div>
+
+            <div class="bg-white py-6">
+                <table class="w-full mb-8">
+                    <tbody> 
+                        <!-- Dirección -->
+                        <tr>
+                            <td class="w-1/4 py-3 pr-4 align-top">
+                                <x-label :value="__('Dirección')" />
+                            </td>
+                            <td class="py-3">
+                                <div class="grid grid-cols-1 gap-4 sm:grid-cols-1">
+                                    <div>
+                                        <textarea id="address" 
+                                                name="address" 
+                                                rows="3" 
+                                                class="w-full border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">{{ old('address') }}
+                                                
+                                        </textarea>
+                                                
+                                        @error('address')
+                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                                        @enderror
+                                    </div>
+                                    
+                                    <div>   
+                                        <input type="text" 
+                                                id="postal_code"
+                                                name="postal_code" 
+                                                value="{{ old('postal_code') }}"
+                                                placeholder="Código Postal" 
+                                                class="w-[120px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                        @error('postal_code')
+                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                                        @enderror
+                                    </div>
+                                    
+                                    <div>
+                                        <input type="text" 
+                                            id="province"
+                                            name="province" 
+                                            value="{{ old('province') }}"
+                                            placeholder="Provincia" 
+                                            class="w-[300px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                        @error('province')
+                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                                        @enderror
+                                    </div>
+                                    
+                                    <div>
+                                        <livewire:country-select :initialCountry="old('country')" />
+                                        @error('country')
+                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                                        @enderror
+                                    </div>
+                                </div>
+                            </td>
+                        </tr>
+                        
+                        <!-- Mapa para Coordenadas -->
+                        <tr>
+                            <td class="w-1/4 py-3 pr-4 align-top">
+                                <x-label :value="__('Seleccione Ubicación')" />
+                            </td>
+                            <td class="py-3">
+                                <div id="map" class="h-64 border-2 border-gray-200"></div>
+                                <div class="grid grid-cols-2 gap-4 mt-2">
+                                    <div>
+                                        <x-label for="latitude" :value="__('Latitud')" />
+                                        <input type="number" 
+                                                id="latitude"
+                                                name="latitude" 
+                                                value="{{ old('latitude') }}"
+                                                step="any"
+                                                class="border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                    </div>
+                                    <div>
+                                        <x-label for="longitude" :value="__('Longitud')" />
+                                        <input type="number" 
+                                            id="longitude"
+                                            name="longitude" 
+                                            value="{{ old('longitude') }}"
+                                            step="any"
+                                            class="border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                    </div>
+                                </div>
+                                @error('latitude')
+                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                                @enderror
+                                @error('longitude')
+                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
+                                @enderror
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Otros datos</span>
+                </div>
+            </div>
+
+            <div class="bg-white py-6">
+                <table class="w-full mb-8">
+                    <tbody>
                        <!-- Imagen de Referencia -->
                        <tr>
                            <td class="w-1/4 py-3 pr-4 align-top">
@@ -134,90 +253,6 @@
                            </td>
                        </tr>

-                                <!-- Dirección -->
-                                <tr>
-                                    <td class="w-1/4 py-3 pr-4 align-top">
-                                        <x-label :value="__('Ubicación')" />
-                                    </td>
-                                    <td class="py-3">
-                                        <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
-                                            <div>
-                                                <x-input id="address" class="block w-full mt-1" 
-                                                    type="text" name="address" 
-                                                    :value="old('address')" 
-                                                    placeholder="Dirección" />
-                                                @error('address')
-                                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                                @enderror
-                                            </div>
-                                            
-                                            <div>
-                                                <x-input id="postal_code" class="block w-full mt-1" 
-                                                    type="text" name="postal_code" 
-                                                    :value="old('postal_code')" 
-                                                    placeholder="Código Postal" />
-                                                @error('postal_code')
-                                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                                @enderror
-                                            </div>
-                                            
-                                            <div>
-                                                <x-input id="province" class="block w-full mt-1" 
-                                                    type="text" name="province" 
-                                                    :value="old('province')" 
-                                                    placeholder="Provincia" />
-                                                @error('province')
-                                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                                @enderror
-                                            </div>
-                                            
-                                            <div>
-                                                <x-select id="country" name="country" class="block w-full mt-1">
-                                                    <option :value="">Seleccione País</option>
-                                                    @foreach(config('countries') as $code => $name)
-                                                        <option :value="{{ $code }}" {{ old('country') == $code ? 'selected' : '' }}>
-                                                            {{ $name }}
-                                                        </option>
-                                                    @endforeach
-                                                </x-select>
-                                                @error('country')
-                                                    <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                                @enderror
-                                            </div>
-                                        </div>
-                                    </td>
-                                </tr>
-                                
-                                <!-- Mapa para Coordenadas -->
-                                <tr>
-                                    <td class="w-1/4 py-3 pr-4 align-top">
-                                        <x-label :value="__('Seleccione Ubicación en el Mapa')" />
-                                    </td>
-                                    <td class="py-3">
-                                        <div id="map" class="h-64 rounded-lg border-2 border-gray-200"></div>
-                                        <div class="grid grid-cols-2 gap-4 mt-2">
-                                            <div>
-                                                <x-label for="latitude" :value="__('Latitud')" />
-                                                <x-input id="latitude" name="latitude" 
-                                                    type="number" step="any" 
-                                                    :value="old('latitude')" required />
-                                            </div>
-                                            <div>
-                                                <x-label for="longitude" :value="__('Longitud')" />
-                                                <x-input id="longitude" name="longitude" 
-                                                    type="number" step="any" 
-                                                    :value="old('longitude')" required />
-                                            </div>
-                                        </div>
-                                        @error('latitude')
-                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                        @enderror
-                                        @error('longitude')
-                                            <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                        @enderror
-                                    </td>
-                                </tr>
-                        
                        <!-- Icono y Categorías -->
                        <tr>
                            <td class="w-1/4 py-3 pr-4 align-top">
@@ -255,21 +290,6 @@
                            </td>
                        </tr>
                
-                                <!-- Fechas Importantes -->
-                                <tr>
-                                    <td class="w-1/4 py-3 pr-4 align-top">
-                                        <x-label for="start_date" :value="__('Fechas')" />
-                                    </td>
-                                    <td class="py-3">
-                                        <div class="flex items-center gap-4 mt-2">
-                                            <span class="text-gray-700">de</span>
-                                            <x-input id="start_date" type="date" name="start_date" :value="old('start_date')" />
-                                            <span class="text-gray-700">a</span>
-                                            <x-input id="deadline" type="date" name="deadline" :value="old('deadline')" min="{{ now()->format('Y-m-d') }}" />
-                                        </div>
-                                    </td>
-                                </tr>
-                        
                        <!-- Archivos Adjuntos -->
                        <tr>
                            <td class="w-1/4 py-3 pr-4 align-top">
@@ -288,7 +308,7 @@
                                            
                                            <template x-if="files.length === 0">
                                                <div>
-                                                            <x-icons.upload class="mx-auto h-12 w-12 text-gray-400" />
+                                                    <x-icons icon="upload" class="mx-auto h-12 w-12 text-gray-400" />
                                                    <p class="mt-1 text-sm text-gray-600">
                                                        Arrastra archivos o haz clic para subir
                                                    </p>
@@ -325,7 +345,7 @@
                                            value="{{ $user->id }}"
                                            {{ in_array($user->id, old('team', [])) ? 'checked' : '' }}
                                            class="rounded border-gray-300 text-blue-600 shadow-sm focus:ring-blue-500">
-                                                <span class="text-sm text-gray-700">{{ $user->name }}</span>
+                                        <span class="text-sm text-gray-700">{{ $user->first_name}} {{ $user->last_name}}</span>
                                    </label>
                                    @endforeach
                                </div>
@@ -336,6 +356,7 @@
                        </tr>
                    </tbody>
                </table>
+            </div>
            
            <!-- Botones de Acción -->
            <div class="flex justify-end mt-8 space-x-4">
@@ -349,12 +370,9 @@
                </x-button>
            </div>
        </form>
-                </div>
-            </div>
-        </div>
+
    </div>
    
-    @push('styles')
    <link href="https://cdn.jsdelivr.net/npm/@yaireo/tagify/dist/tagify.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.snow.css" rel="stylesheet" />

@@ -363,11 +381,7 @@
    integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A=="
    crossorigin=""/>

-    @endpush

-
-
-    @push('scripts')
    <script src="https://cdn.jsdelivr.net/npm/@yaireo/tagify"></script>
    <script src="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.js"></script>
    <!-- Leaflet JS -->
@@ -469,5 +483,4 @@
        };
    </script>

-    @endpush
 </x-layouts.app>
--- a/resources/views/projects/create.blade.php.back
+++ b/resources/views/projects/create.blade.php.back
@@ -1,386 +0,0 @@
-<!-- resources/views/projects/create.blade.php -->
-<x-layouts.app :title="__('Create Project')">
-    <x-slot name="header">
-        <h2 class="text-xl font-semibold leading-tight text-gray-800">
-            Nuevo Proyecto
-        </h2>
-    </x-slot>
-
-    <div class="py-6">
-        <div class="mx-auto max-w-7xl sm:px-6 lg:px-8">
-            <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
-                <div class="p-6 bg-white border-b border-gray-200">
-                    <form method="POST" action="{{ route('projects.store') }}" enctype="multipart/form-data">
-                        @csrf                        
-                        <!-- Sección de Información Básica -->
-                        <div class="grid gap-6 mb-8 md:grid-cols-2">
-                            <!-- Columna Izquierda -->
-                            <div>
-                                <!-- Nombre -->
-                                <div class="mb-6">
-                                    <x-label for="name" value="__('Nombre del Proyecto')" />
-                                    <x-input id="name" class="block w-full mt-1" 
-                                           type="text" name="name" value="old('name')" required />
-                                    @error('name')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                </div>
-
-                                <!-- Descripción -->
-                                <div class="mb-6">
-                                    <x-label for="description" value="__('Descripción')" />
-                                    <x-textarea id="description" class="block w-full mt-1" 
-                                              name="description" rows="4" required>
-                                        {{ old('description') }}
-                                    </x-textarea>
-                                    @error('description')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                </div>
-                                
-                                <!-- Editor Enriquecido -->
-                                <div class="mb-6">
-                                    <x-label for="description" value="__('Descripción Detallada')" />
-                                    <div id="editor-container">
-                                        <!-- Barra de herramientas -->
-                                        <div id="toolbar">
-                                            <button class="ql-bold"></button>
-                                            <button class="ql-italic"></button>
-                                            <button class="ql-underline"></button>
-                                            <button class="ql-strike"></button>
-                                            <button class="ql-blockquote"></button>
-                                            <button class="ql-code-block"></button>
-                                            <button class="ql-link"></button>
-                                            <button class="ql-image"></button>
-                                            
-                                        </div>
-                                    
-                                        <!-- Editor -->
-                                        <div id="rich-editor">{!! old('description') !!}</div>
-                                    </div>
-                                    @error('description')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                </div>
-
-                                <!-- Estado -->
-                                <div class="mb-6">
-                                    <x-label for="status" value="__('Estado del Proyecto')" />
-                                    <x-select id="status" name="status" class="block w-full mt-1">
-                                        <option value="active" {{ old('status') == 'active' ? 'selected' : '' }}>Activo</option>
-                                        <option value="inactive" {{ old('status') == 'inactive' ? 'selected' : '' }}>Inactivo</option>
-                                    </x-select>
-                                    @error('status')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                </div>
-
-                                <!-- Imagen de Referencia -->
-                                <div class="mb-6">
-                                    <x-label for="project_image" value="__('Imagen de Referencia')" />
-                                    <div class="relative mt-1">
-                                        <input type="file" id="project_image" name="project_image"
-                                               class="block w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4
-                                                     file:rounded-md file:border-0
-                                                     file:text-sm file:font-semibold
-                                                     file:bg-blue-50 file:text-blue-700
-                                                     hover:file:bg-blue-100"
-                                               accept="image/*"
-                                               onchange="previewImage(event)">
-                                        <div class="mt-2" id="image-preview-container" style="display:none;">
-                                            <img id="image-preview" class="object-cover h-48 w-full rounded-lg">
-                                        </div>
-                                    </div>
-                                    @error('project_image')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                </div>
-                            </div>
-
-                            <!-- Columna Derecha -->
-                            <div>
-                                <!-- Dirección -->
-                                <div class="mb-6">
-                                    <x-label value="__('Ubicación')" />
-                                    <div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
-                                        <div>
-                                            <x-input id="address" class="block w-full mt-1" 
-                                                   type="text" name="address" 
-                                                   value="old('address')" 
-                                                   placeholder="Dirección" />
-                                            @error('address')
-                                                <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                            @enderror
-                                        </div>
-                                        
-                                        <div>
-                                            <x-input id="postal_code" class="block w-full mt-1" 
-                                                   type="text" name="postal_code" 
-                                                   value="old('postal_code')" 
-                                                   placeholder="Código Postal" />
-                                            @error('postal_code')
-                                                <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                            @enderror
-                                        </div>
-                                        
-                                        <div>
-                                            <x-input id="province" class="block w-full mt-1" 
-                                                   type="text" name="province" 
-                                                   value="old('province')" 
-                                                   placeholder="Provincia" />
-                                            @error('province')
-                                                <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                            @enderror
-                                        </div>
-                                        
-                                        <div>
-                                            <x-select id="country" name="country" class="block w-full mt-1">
-                                                <option value="">Seleccione País</option>
-                                                @foreach(config('countries') as $code => $name)
-                                                    <option value="{{ $code }}" {{ old('country') == $code ? 'selected' : '' }}>
-                                                        {{ $name }}
-                                                    </option>
-                                                @endforeach
-                                            </x-select>
-                                            @error('country')
-                                                <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                            @enderror
-                                        </div>
-                                    </div>
-                                </div>
-
-                                <!-- Mapa para Coordenadas -->
-                                <div class="mb-6">
-                                    <x-label value="__('Seleccione Ubicación en el Mapa')" />
-                                    <div id="map" class="h-64 rounded-lg border-2 border-gray-200"></div>
-                                    <div class="grid grid-cols-2 gap-4 mt-2">
-                                        <div>
-                                            <x-label for="latitude" value="__('Latitud')" />
-                                            <x-input id="latitude" name="latitude" 
-                                                   type="number" step="any" 
-                                                   value="old('latitude')" required />
-                                        </div>
-                                        <div>
-                                            <x-label for="longitude" value="__('Longitud')" />
-                                            <x-input id="longitude" name="longitude" 
-                                                   type="number" step="any" 
-                                                   value="old('longitude')" required />
-                                        </div>
-                                    </div>
-                                    @error('latitude')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                    @error('longitude')
-                                        <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                                    @enderror
-                                </div>
-                            </div>
-                        </div>
-
-                        <!-- Sección Principal en 2 Columnas -->
-                        <div class="grid gap-6 mb-8 md:grid-cols-2">
-                            <!-- Columna Izquierda -->
-                            <div>
-                                <!-- Icono y Categorías -->
-                                <div class="mb-6">
-                                    <x-label value="__('Identificación Visual')" />
-                                    <div class="grid grid-cols-2 gap-4">
-                                        <div>
-                                            <x-label for="icon" value="__('Icono del Proyecto')" />
-                                            <div class="relative mt-1">
-                                                <select id="icon" name="icon" 
-                                                    class="w-full rounded-md shadow-sm border-gray-300 focus:border-blue-300 focus:ring focus:ring-blue-200 focus:ring-opacity-50">
-                                                    <option value="">Seleccionar Icono</option>
-                                                    @foreach(config('project.icons') as $icon)
-                                                    <option value="{{ $icon }}" 
-                                                        {{ old('icon') == $icon ? 'selected' : '' }}>
-                                                        <i class="fas fa-{{ $icon }} mr-2"></i>
-                                                        {{ Str::title($icon) }}
-                                                    </option>
-                                                    @endforeach
-                                                </select>
-                                            </div>
-                                        </div>
-                                        
-                                        <div>
-                                            <x-label for="categories" value="__('Categorías')" />
-                                            <x-multiselect 
-                                                name="categories[]" 
-                                                :options="$categories"
-                                                :selected="old('categories', [])"
-                                                placeholder="Seleccione categorías"
-                                            />
-                                        </div>
-                                    </div>
-                                </div>
-
-                                <!-- Fechas Importantes -->
-                                <div class="grid grid-cols-2 gap-4 mb-6">
-                                    <div>
-                                        <x-label for="start_date" value="__('Fecha de Inicio')" />
-                                        <x-input id="start_date" type="date" 
-                                               name="start_date" value="old('start_date')" />
-                                    </div>
-                                    <div>
-                                        <x-label for="deadline" value="__('Fecha Límite')" />
-                                        <x-input id="deadline" type="date" 
-                                               name="deadline" value="old('deadline')" 
-                                               min="{{ now()->format('Y-m-d') }}" />
-                                    </div>
-                                </div>
-                            </div>
-
-                            <!-- Columna Derecha -->
-                            <div>
-                                <!-- Archivos Adjuntos -->
-                                <div class="mb-6">
-                                    <x-label value="__('Documentos Iniciales')" />
-                                    <div x-data="{ files: [] }" class="mt-1">
-                                        <div class="flex items-center justify-center px-6 pt-5 pb-6 border-2 border-gray-300 border-dashed rounded-md">
-                                            <div class="text-center">
-                                                <input type="file" 
-                                                       name="documents[]" 
-                                                       multiple
-                                                       class="absolute opacity-0"
-                                                       x-ref="fileInput"
-                                                       @change="files = Array.from($event.target.files)">
-                                                
-                                                <template x-if="files.length === 0">
-                                                    <div>
-                                                        <x-icons.upload class="mx-auto h-12 w-12 text-gray-400" />
-                                                        <p class="mt-1 text-sm text-gray-600">
-                                                            Arrastra archivos o haz clic para subir
-                                                        </p>
-                                                    </div>
-                                                </template>
-
-                                                <template x-if="files.length > 0">
-                                                    <div class="space-y-2">
-                                                        <template x-for="(file, index) in files" :key="index">
-                                                            <div class="flex items-center text-sm text-gray-600">
-                                                                <x-icons icon="document" class="w-5 h-5 mr-2" />
-                                                                <span x-text="file.name"></span>
-                                                            </div>
-                                                        </template>
-                                                    </div>
-                                                </template>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-
-                                <!-- Mapa y Ubicación (Implementación previa) -->
-                                <!-- ... (Mantener sección de mapa y ubicación anterior) ... -->
-                            </div>
-                        </div>
-
-                        <!-- Resto del formulario -->
-                        <!-- ... (Mantener secciones anteriores de equipo, estado, etc) ... -->
-
-                        <!-- Miembros del Equipo -->
-                        <div class="mb-6">
-                            Miembros del Equipo
-                            <x-label value="__('Miembros del Equipo')" />
-                            <div class="grid grid-cols-1 mt-2 gap-y-2 gap-x-4 sm:grid-cols-2">
-                                @foreach($users as $user)
-                                <label class="flex items-center space-x-2">
-                                    <input type="checkbox" 
-                                           name="team[]" 
-                                           value="{{ $user->id }}"
-                                           {{ in_array($user->id, old('team', [])) ? 'checked' : '' }}
-                                           class="rounded border-gray-300 text-blue-600 shadow-sm focus:ring-blue-500">
-                                    <span class="text-sm text-gray-700">{{ $user->name }}</span>
-                                </label>
-                                @endforeach
-                            </div>
-                            @error('team')
-                                <p class="mt-2 text-sm text-red-600">{{ $message }}</p>
-                            @enderror
-                        </div>
-
-                        <!-- Botones de Acción -->
-                        <div class="flex justify-end mt-8 space-x-4">
-                            <a href="{{ route('projects.index') }}" 
-                               class="px-4 py-2 text-gray-600 bg-white border border-gray-300 rounded-md shadow-sm hover:bg-gray-50">
-                                {{ __('Cancelar') }}
-                            </a>
-                            <x-button type="submit" class="bg-blue-600 hover:bg-blue-700">
-                                <x-icons icon="save" class="w-5 h-5 mr-2" />
-                                {{ __('Crear Proyecto') }}
-                            </x-button>
-                        </div>
-                    </form>
-                </div>
-            </div>
-        </div>
-    </div>
-
-    @push('styles')
-    <link href="https://cdn.jsdelivr.net/npm/@yaireo/tagify/dist/tagify.css" rel="stylesheet">
-    <link href="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.snow.css" rel="stylesheet" />
-    @endpush
-
-    @push('scripts')
-    <script src="https://cdn.jsdelivr.net/npm/@yaireo/tagify"></script>
-    <script src="https://cdn.jsdelivr.net/npm/quill@2.0.3/dist/quill.js"></script>
-    <script>
-        // Editor Quill
-        onst toolbarOptions = [
-            ['bold', 'italic', 'underline', 'strike'],        // toggled buttons
-            ['blockquote', 'code-block'],
-            ['link', 'image', 'video', 'formula'],
-
-            [{ 'header': 1 }, { 'header': 2 }],               // custom button values
-            [{ 'list': 'ordered'}, { 'list': 'bullet' }, { 'list': 'check' }],
-            [{ 'script': 'sub'}, { 'script': 'super' }],      // superscript/subscript
-            [{ 'indent': '-1'}, { 'indent': '+1' }],          // outdent/indent
-            [{ 'direction': 'rtl' }],                         // text direction
-
-            [{ 'size': ['small', false, 'large', 'huge'] }],  // custom dropdown
-            [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
-
-            [{ 'color': [] }, { 'background': [] }],          // dropdown with defaults from theme
-            [{ 'font': [] }],
-            [{ 'align': [] }],
-
-            ['clean']                                         // remove formatting button
-        ];
-
-        const quill = new Quill('#rich-editor', {
-            theme: 'snow',
-            modules: {
-                toolbar: toolbarOptions,
-                placeholder: 'Description...',
-            }
-        });
-
-        // Tagify para categorías
-        new Tagify(document.querySelector('[name="categories[]"]'), {
-            enforceWhitelist: true,
-            whitelist: @json($categories->pluck('name')),
-            dropdown: {
-                enabled: 1,
-                maxItems: 5
-            }
-        });
-    </script>
-    <script>
-        function previewImage(event) {
-            const reader = new FileReader();
-            const preview = document.getElementById('image-preview');
-            
-            reader.onload = function() {
-                preview.innerHTML = `
-                    <img src="${reader.result}" 
-                         class="object-cover w-full h-48 rounded-lg shadow-sm"
-                         alt="Vista previa de la imagen">
-                `;
-            }
-            
-            if(event.target.files[0]) {
-                reader.readAsDataURL(event.target.files[0]);
-            }
-        }
-    </script>
-    @endpush
-</x-layouts.app>
--- a/resources/views/projects/index.blade.php
+++ b/resources/views/projects/index.blade.php
@@ -109,11 +109,7 @@
            </div>

            <!-- Paginación -->
-            @if($projects->hasPages())
-            <div class="mt-6">
-                {{ $projects->withQueryString()->links() }}
-            </div>
-            @endif
+
        </div>
    </div>
 </x-layouts.app>
--- a/resources/views/projects/show.blade.php
+++ b/resources/views/projects/show.blade.php
@@ -0,0 +1,30 @@
+<x-layouts.app :title="__('Show Project')">
+    <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-6">
+        <!-- Barra de herramientas con breadcrumbs -->
+        <div class="mb-6">
+            <nav class="flex" aria-label="Breadcrumb">
+                <ol class="flex items-center space-x-2">
+                    <li>
+                        <div class="flex items-center">
+                            <a href="{{ route('projects.index') }}" class="text-gray-400 hover:text-gray-500">
+                                <x-icons icon="home" class="h-5 w-5" />
+                            </a>
+                        </div>
+                    </li>
+                    
+                </ol>
+            </nav>
+        </div>
+
+        <!-- Barra de herramientas principal -->
+        javi
+        
+
+        <!-- Componente principal Livewire -->
+        
+
+        <!-- Modales -->
+
+    </div>
+    
+</x-layouts.app>
--- a/resources/views/projects/show.blade.php.back
+++ b/resources/views/projects/show.blade.php.back
@@ -1,48 +0,0 @@
-@extends('layouts.app')
-
-@section('content')
-<div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 py-6">
-    <!-- Barra de herramientas con breadcrumbs -->
-    <div class="mb-6">
-        <nav class="flex" aria-label="Breadcrumb">
-            <ol class="flex items-center space-x-2">
-                <li>
-                    <div class="flex items-center">
-                        <a href="{{ route('projects.index') }}" class="text-gray-400 hover:text-gray-500">
-                            <x-icons.home class="h-5 w-5" />
-                        </a>
-                    </div>
-                </li>
-                @foreach($breadcrumbs as $crumb)
-                <li>
-                    <div class="flex items-center">
-                        <x-icons.chevron-right class="h-5 w-5 text-gray-400" />
-                        @if(!$loop->last)
-                        <a href="{{ $crumb['url'] }}" class="ml-2 text-sm font-medium text-gray-500 hover:text-gray-700">
-                            {{ $crumb['name'] }}
-                        </a>
-                        @else
-                        <span class="ml-2 text-sm font-medium text-gray-700">{{ $crumb['name'] }}</span>
-                        @endif
-                    </div>
-                </li>
-                @endforeach
-            </ol>
-        </nav>
-    </div>
-
-    <!-- Barra de herramientas principal -->
-    <x-toolbar :project="$project" :current-folder="$currentFolder" />
-
-    <!-- Componente principal Livewire -->
-    <livewire:project-show 
-        :project="$project"
-        :current-folder="$currentFolder ?? null"
-        wire:key="project-show-{{ $project->id }}-{{ $currentFolder->id ?? 'root' }}"
-    />
-
-    <!-- Modales -->
-    @livewire('folder.create-modal', ['project' => $project, 'parentFolder' => $currentFolder ?? null])
-    @livewire('document.upload-modal', ['project' => $project, 'currentFolder' => $currentFolder ?? null])
-</div>
-@endsection
--- a/resources/views/users/create.blade.php
+++ b/resources/views/users/create.blade.php
@@ -0,0 +1,351 @@
+<x-layouts.app title="{{ isset($user) ? __('Edit User') : __('Create User') }}">
+    <div class="max-w-4xl mx-auto px-0 py-4">
+        <!-- Header -->
+        <div class="mb-8">
+            <div class="flex items-center gap-4 mb-4">
+                <svg class="w-10 h-10 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/>
+                </svg>
+                <h1 class="text-3xl font-bold text-gray-800">
+                    {{ isset($user) ? 'Editar Usuario' : 'Nuevo Usuario' }}
+                </h1>
+            </div>
+            <p class="text-gray-600 text-sm">
+                @isset($user)
+                    Modifique los campos necesarios para actualizar la información del usuario.
+                @else
+                    Complete todos los campos obligatorios para registrar un nuevo usuario en el sistema.
+                @endisset
+            </p>
+        </div>
+
+
+        @if(session('error'))
+        <div id="error-message" class="mb-4 p-4 bg-red-100 border border-red-400 text-red-700 rounded">
+            {{ session('error') }}
+        </div>
+        @endif
+
+        @if($errors->any())
+        <div class="mb-4 p-4 bg-red-100 border border-red-400 text-red-700 rounded">
+            <ul>
+                @foreach($errors->all() as $error)
+                <li>{{ $error }}</li>
+                @endforeach
+            </ul>
+        </div>
+        @endif
+
+        <form method="POST" action="{{ isset($user) ? route('users.update', $user) : route('users.store') }}">
+            @csrf
+            @isset($user)
+                @method('PUT')
+            @endisset
+
+            <!-- Separador -->
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Datos Personales</span>
+                </div>
+            </div>
+
+            <!-- Datos Personales -->
+            <div class="bg-white py-6">
+                <table class="w-full">
+                    <tbody class="space-y-4">
+                        <!-- Título de cortesía -->
+                        <tr>
+                            <td class="py-2 pr-4 w-1/3">
+                                <label class="block text-sm font-medium text-gray-700">
+                                    Título de cortesía
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <select name="title" class="w-[150px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                    <option value="">Seleccionar...</option>
+                                    <option value="Sr.">Sr.</option>
+                                    <option value="Sra.">Sra.</option>
+                                    <option value="Dr.">Dr.</option>
+                                </select>
+                            </td>
+                        </tr>
+                        
+                        <!-- Nombre -->
+                        <tr>
+                            <td class="py-2 pr-4">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Nombre
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <input type="text" name="first_name" required 
+                                    value="{{ old('first_name', $user->first_name ?? '') }}" 
+                                    class="w-[250px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none" 
+                                    autofocus>
+                            </td>
+                        </tr>
+
+                        <!-- Apellidos -->
+                        <tr>
+                            <td class="py-2 pr-4">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Apellidos
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <input type="text" name="last_name" required 
+                                        value="{{ old('last_name', $user->last_name ?? '') }}" 
+                                        class="w-[250px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                            </td>
+                        </tr>
+
+                        <!-- Nombre de Login -->
+                        <tr>
+                            <td class="py-2 pr-4">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Nombre de Login
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <input type="text" name="username" required 
+                                        value="{{ old('username', $user->username ?? '') }}"
+                                        class="w-[250px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <!-- Separador -->
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Configuración de acceso</span>
+                </div>
+            </div>
+
+            <!-- Configuración de Acceso -->
+            <div class="bg-white py-6">
+                <table class="w-full">
+                    <tbody>
+                        <!-- Intervalo de fechas -->
+                        <tr>
+                            <td class="py-2 pr-4 w-1/3">
+                                <label class="block text-sm font-medium text-gray-700">
+                                    Validez de acceso
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="flex gap-4">
+                                    de
+                                    <input type="date" name="start_date" 
+                                            value="{{ old('start_date', isset($user->access_start) ? $user->access_start->format('Y-m-d') : '') }}"
+                                            class="w-[150px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                    a
+                                    <input type="date" name="end_date" 
+                                            value="{{ old('end_date', isset($user->access_end) ? $user->access_end->format('Y-m-d') : '') }}"
+                                            class="w-[150px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                </div>
+                            </td>
+                        </tr>
+
+                        <!-- Contraseña -->
+                        <tr>
+                            <td class="py-2 pr-4">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Contraseña
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="flex gap-2">
+                                    <input type="text" name="password" id="password" 
+                                            {{ !isset($user) ? 'required' : '' }}
+                                            class="w-[250px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                    <button type="button" onclick="generatePassword()" 
+                                            class="px-2 py-1 bg-blue-100 text-blue-700 rounded-md hover:bg-blue-200 flex items-center gap-2">
+                                        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
+                                            <path fill-rule="evenodd" d="M18 8a6 6 0 01-7.743 5.743L10 14l-1 1-1 1H6v2H2v-4l4.257-4.257A6 6 0 1118 8zm-6-4a1 1 0 100 2 2 2 0 012 2 1 1 0 102 0 4 4 0 00-4-4z" clip-rule="evenodd" />
+                                        </svg>                                        
+                                    </button>
+                                </div>
+                                
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <!-- Separador -->
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Datos de contacto</span>
+                </div>
+            </div>
+
+            <!-- Datos de Contacto -->
+            <div class="bg-white py-6">
+                <table class="w-full">
+                    <tbody>
+                        <tr>
+                            <td class="py-2 pr-4 w-1/3">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Email
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="flex items-center gap-2">
+                                    <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
+                                    </svg>
+                                    <input type="email" name="email" required 
+                                            value="{{ old('email', $user->email ?? '') }}" 
+                                            class="w-[300px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                </div>
+                            </td>
+                        </tr>
+                        
+                        <tr>
+                            <td class="py-2 pr-4">
+                                <label class="block text-sm font-medium text-gray-700">
+                                    Teléfono
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="flex items-center gap-2">
+                                    <svg class="w-5 h-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z"/>
+                                    </svg>
+                                    <input type="tel" name="phone" 
+                                            value="{{ old('phone', $user->phone ?? '') }}"
+                                            class="w-[250px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                </div>
+                            </td>
+                        </tr>
+                        
+                        <tr>
+                            <td class="py-2 pr-4 align-top">
+                                <label class="block text-sm font-medium text-gray-700">
+                                    Dirección
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="flex items-start gap-2">
+                                    <svg class="w-5 h-5 text-gray-400 mt-1.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"/>
+                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"/>
+                                    </svg>
+                                    <textarea name="address" rows="3" 
+                                                class="w-full border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">{{ old('address', $user->address ?? '') }}</textarea>
+                                </div>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+
+            <!-- Separador -->
+            <div class="relative">
+                <div class="absolute inset-0 flex items-center">
+                    <div class="w-full border-t border-gray-300"></div>
+                </div>
+                <div class="relative flex justify-center">
+                    <span class="px-4 bg-white text-sm text-gray-500">Otros datos</span>
+                </div>
+            </div>
+
+            <!-- Datos de Contacto -->
+            <div class="bg-white py-6">
+                <table class="w-full">
+                    <tbody>
+                        <!-- Estado -->
+                        <tr>
+                            <td class="py-2 pr-4 w-1/3">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Estado
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="flex items-center gap-2">
+                                    <select name="is_active" class="w-[200px] border-b-1 border-gray-300 focus:border-blue-500 focus:outline-none">
+                                        <option value="Activo">Activo</option>
+                                        <option value="Inactivo">Inactivo</option>
+                                    </select>
+                                </div>
+                            </td>
+                        </tr>
+
+                        <!-- Foto -->
+                        <tr>
+                            <td class="py-2 pr-4">
+                                <label class="block text-sm font-bold text-gray-700">
+                                    Foto
+                                </label>
+                            </td>
+                            <td class="py-2">
+                                <div class="mb-6">
+                                    @livewire('image-uploader', [
+                                        'fieldName' => 'image_path', // Nombre del campo en la BD
+                                        'label' => 'Imagen principal' // Etiqueta personalizada
+                                    ])
+                                    <!-- Campo oculto para la ruta de la imagen -->
+                                    <input type="hidden" name="profile_photo_path" id="profilePhotoPathInput" value="{{ old('profile_photo_path', $user->profile_photo_path) }}">
+                                </div>
+                            </td>
+                        </tr>php
+
+                    </tbody>
+                </table>
+            </div>
+
+            <!-- Botón de envío -->
+            <div class="text-right">
+                <button type="submit" 
+                        class="px-6 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 transition-colors">
+                        {{ isset($user) ? 'Actualizar Usuario' : 'Crear Usuario' }}
+                </button>
+            </div>
+        </form>
+    </div>
+
+        
+    <script>
+        // Escuchar el evento de Livewire y actualizar el campo oculto
+        document.addEventListener('imageUploaded', (event) => {
+            document.getElementById('profilePhotoPathInput').value = event.detail.path;
+        });
+
+        document.addEventListener('imageRemoved', (event) => {
+            document.getElementById('profilePhotoPathInput').value = '';
+        });
+
+        function generatePassword() {
+                const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()';
+                let password = '';
+                for (let i = 0; i < 12; i++) {
+                    password += chars.charAt(Math.floor(Math.random() * chars.length));
+                }
+                document.getElementById('password').value = password;
+            }
+            
+        /*
+        <div class="mt-2 flex items-center gap-2">
+            <input type="checkbox" onclick="togglePasswordVisibility()"> 
+            <span class="text-sm text-gray-500">Mostrar contraseña</span>
+        </div>
+        
+        function togglePasswordVisibility() {
+            const passwordField = document.getElementById('password');
+            passwordField.type = passwordField.type === 'password' ? 'text' : 'password';
+        }
+        */
+    </script>
+
+</x-layouts.app>
--- a/resources/views/users/index.blade.php
+++ b/resources/views/users/index.blade.php
@@ -0,0 +1,17 @@
+<x-layouts.app :title="__('Users')">
+    <div class="max-w-7xl mx-auto px-4 py-8">
+        <div class="flex justify-between items-center mb-6">
+            <div class="flex items-center gap-4 mb-4">
+                <svg class="w-8 h-8 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/>
+                </svg>
+                <h1 class="text-3xl font-bold text-gray-800">Usuarios</h1>
+            </div>
+            <a href="{{ route('users.create') }}" class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700">
+                Nuevo
+            </a>
+        </div>
+    
+        @livewire('user-table')
+    </div>
+</x-layouts.app>
--- a/resources/views/users/show.blade.php
+++ b/resources/views/users/show.blade.php
@@ -0,0 +1,321 @@
+<x-layouts.app :title="__('Show User')">
+
+    <div class="container mx-auto px-4 py-6">
+        <!-- Header Section -->
+        <div class="bg-white rounded-lg shadow-md p-6 mb-6 flex items-center justify-between">
+            <!-- User Info Left -->
+            <div class="flex items-center space-x-6">
+                <!-- User Photo -->
+                <img src="{{ $user->profile_photo_path ? asset('storage/' . $user->profile_photo_path) : 'https://via.placeholder.com/150' }}"
+                    class="w-24 h-24 rounded-full object-cover border-2 border-blue-100">
+                <!-- User Details -->
+                <div>
+                    <h1 class="text-2xl font-bold text-gray-700">
+                        {{ $user->first_name }} {{ $user->last_name }}
+                    </h1>
+                    
+                    <!-- Contact Info -->
+                    <div class="mt-2 space-y-1">
+                        <div class="flex items-center text-gray-600">
+                            <p class="text-sm text-gray-700">
+                                {{ $user->first_name }}
+                            </p>
+                        </div>
+                        
+                        <div class="flex items-center text-gray-600">
+                            <svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 24 24">
+                                <path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 14H4V8l8 5 8-5v10zm-8-7L4 6h16l-8 5z"/>
+                            </svg>
+                            <a href="mailto:{{ $user->email }}" class="hover:text-blue-600">
+                                {{ $user->email }}
+                            </a>
+                        </div>
+                        
+                        @if($user->phone)
+                        <div class="flex items-center text-gray-600">
+                            <svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 24 24">
+                                <path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/>
+                            </svg>
+                            <a href="tel:{{ $user->phone }}" class="hover:text-blue-600">
+                                {{ $user->phone }}
+                            </a>
+                        </div>
+                        @endif
+                    </div>
+                </div>
+            </div>
+
+            <!-- Right Section -->
+            <div class="flex flex-col items-end space-y-4">
+                <!-- Navigation Toolbar -->
+                <div class="flex space-x-2">
+                    <a href="{{ route('users.index') }}" 
+                    class="px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg flex items-center">
+                        <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 10h10a8 8 0 018 8v2M3 10l6 6m-6-6l6-6"/>
+                        </svg>
+                    </a>
+                    
+                    @if($previousUser)
+                    <a href="{{ route('users.show', $previousUser) }}" class="px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg flex items-center">
+                        <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
+                        </svg>
+                    </a>
+                    @endif
+
+                    @if($nextUser)
+                    <a href="{{ route('users.show', $nextUser) }}" 
+                    class="px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-lg flex items-center">
+                        <svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                        </svg>
+                    </a>
+                    @endif
+                </div>
+
+                <!-- Status Badge -->
+                <span class="px-4 py-2 w-30 rounded-lg text-sm text-center font-semibold 
+                            {{ $user->is_active ? 'bg-green-200 text-green-800' : 'bg-red-100 text-red-800' }}">
+                    {{ $user->is_active ? 'Activo' : 'Inactivo' }}
+                </span>
+            </div>
+        </div>
+
+        <!-- Tab Bar -->
+        <div x-data="{ activeTab: 'info' }" class="bg-white rounded-lg shadow-md">
+            <!-- Tab Headers -->
+            <div class="border-b border-gray-200">
+                <nav class="flex space-x-8 px-6">
+                    <button @click="activeTab = 'info'" 
+                            :class="activeTab === 'info' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                            class="py-4 px-1 border-b-2 font-medium">
+                        Información del Usuario
+                    </button>
+                    
+                    <button @click="activeTab = 'permissions'" 
+                            :class="activeTab === 'permissions' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                            class="py-4 px-1 border-b-2 font-medium">
+                        Permisos
+                    </button>
+
+                    <button @click="activeTab = 'projects'" 
+                            :class="activeTab === 'projects' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'" 
+                            class="py-4 px-1 border-b-2 font-medium">
+                        Proyectos
+                    </button>
+                </nav>
+            </div>
+
+            <!-- Tab Content -->
+            <div class="p-6">
+                <!-- Info Tab -->
+                <div x-show="activeTab === 'info'">
+                    <div class="overflow-x-auto">
+                        <table class="min-w-full divide-y divide-gray-200">
+                            <tbody class="bg-white divide-y divide-gray-200">
+                                @foreach(['name' => 'Nombre', 'last_name' => 'Apellido', 'email' => 'Email', 'phone' => 'Teléfono', 'created_at' => 'Fecha Registro'] as $field => $label)
+                                <tr>
+                                    <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">{{ $label }}</td>
+                                    <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                                        {{ $user->$field ?? 'N/A' }}
+                                    </td>
+                                </tr>
+                                @endforeach
+                            </tbody>
+                        </table>
+                    </div>
+
+                    <!-- Action Buttons -->
+                    <div class="mt-6 flex justify-end space-x-4">
+                        <a href="{{ route('users.edit', $user) }}" 
+                        class="w-[150px] px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg flex items-center justify-center">
+                            <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/>
+                            </svg>
+                            Editar
+                        </a>
+
+                        {{-- Formulario de Edición --}}
+                        <form method="POST" action="{{ route('users.update', $user) }}">
+                            @csrf
+                            @method('PUT') <!-- Important! -->
+                            <button type="submit" 
+                                class="w-[150px] px-4 py-2 bg-yellow-500 hover:bg-yellow-600 text-white rounded-lg flex items-center justify-center">
+                                <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636"/>
+                                </svg>
+                                {{ $user->is_active ? 'Desactivar' : 'Activar' }}
+                            </button>
+                        </form>
+
+                        {{-- Formulario de Eliminación --}}
+                        <form method="POST" action="{{ route('users.destroy', $user) }}">
+                            @csrf
+                            @method('DELETE') <!-- Important! -->
+                            <button type="submit" 
+                                    onclick="return confirm('¿Estás seguro de querer eliminar este usuario?')"
+                                    class="px-4 py-2 w-[150px] bg-red-600 hover:bg-red-700 text-white rounded-lg flex items-center justify-center">
+                                <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
+                                </svg>
+                                Eliminar
+                            </button>
+                        </form>
+                    </div>
+                </div>
+
+                <!-- Permissions Tab -->
+                    <div class="space-y-4">
+                        @foreach($permissionGroups as $groupName => $group)
+                        <div class="border rounded-lg overflow-hidden">
+                            <!-- Group Header -->
+                            <div class="bg-gray-50 px-4 py-3 flex justify-between items-center border-b">
+                                <h3 class="font-semibold text-gray-700">
+                                    {{ ucfirst($groupName) }} Permissions
+                                </h3>
+                                
+                                <div class="flex space-x-2">
+                                    <!-- Toggle All On -->
+                                    <button wire:click="toggleAllGroupPermissions('{{ $groupName }}', true)"
+                                            class="px-3 py-1 text-xs bg-green-100 text-green-800 rounded hover:bg-green-200 flex items-center">
+                                        <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
+                                        </svg>
+                                        Activar Todos
+                                    </button>
+                                    
+                                    <!-- Toggle All Off -->
+                                    <button wire:click="toggleAllGroupPermissions('{{ $groupName }}', false)"
+                                            class="px-3 py-1 text-xs bg-red-100 text-red-800 rounded hover:bg-red-200 flex items-center">
+                                        <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+                                        </svg>
+                                        Desactivar Todos
+                                    </button>
+                                    
+                                    <!-- Collapse Toggle -->
+                                    <button wire:click="toggleGroupCollapse('{{ $groupName }}')"
+                                            class="px-3 py-1 text-xs bg-gray-100 text-gray-800 rounded hover:bg-gray-200 flex items-center">
+                                        <svg x-show="!collapsedGroups.includes('{{ $groupName }}')" class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
+                                        </svg>
+                                        <svg x-show="collapsedGroups.includes('{{ $groupName }}')" class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24" x-cloak>
+                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                                        </svg>
+                                    </button>
+                                </div>
+                            </div>
+                            
+                            <!-- Permissions List -->
+                            <div x-show="!collapsedGroups.includes('{{ $groupName }}')" class="divide-y divide-gray-200">
+                                @foreach($group['permissions'] as $permission)
+                                <div class="px-4 py-3 flex justify-between items-center hover:bg-gray-50">
+                                    <div class="flex items-center">
+                                        <span class="text-sm text-gray-700">{{ $permission['description'] ?? $permission['name'] }}</span>
+                                        
+                                        @if($permission['description'])
+                                        <span class="ml-2 text-xs text-gray-500">({{ $permission['name'] }})</span>
+                                        @endif
+                                    </div>
+                                    
+                                    <label class="relative inline-flex items-center cursor-pointer">
+                                        <input type="checkbox" 
+                                            @if(true || $user->hasPermissionTo($permission['name'])) checked @endif
+                                            wire:change="togglePermission('{{ $permission['name'] }}')"
+                                            class="sr-only peer">
+                                        <div class="w-11 h-6 bg-gray-200 peer-focus:outline-none rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-600"></div>
+                                    </label>
+                                </div>
+                                @endforeach
+                            </div>
+                        </div>
+                        @endforeach
+                    </div>
+                </div>
+
+                <!-- Pestaña de Proyectos -->
+                <div x-show="activeTab === 'projects'" x-cloak>
+                    <div class="space-y-6">
+                        <!-- Proyectos Actuales -->
+                        <div class="border rounded-lg p-4">
+                            <h3 class="text-lg font-semibold mb-4">Proyectos Asociados</h3>
+                            
+                            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+                                falta implementar
+                            </div>
+                        </div>
+
+                        <!-- Añadir Proyectos (Solo con permisos) -->
+                        
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <style>
+        .switch {
+            position: relative;
+            display: inline-block;
+            width: 60px;
+            height: 34px;
+        }
+
+        .switch input { 
+            opacity: 0;
+            width: 0;
+            height: 0;
+        }
+
+        .slider {
+            position: absolute;
+            cursor: pointer;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+            background-color: #ccc;
+            transition: .4s;
+            border-radius: 34px;
+        }
+
+        .slider:before {
+            position: absolute;
+            content: "";
+            height: 26px;
+            width: 26px;
+            left: 4px;
+            bottom: 4px;
+            background-color: white;
+            transition: .4s;
+            border-radius: 50%;
+        }
+
+        input:checked + .slider {
+            background-color: #3B82F6;
+        }
+
+        input:checked + .slider:before {
+            transform: translateX(26px);
+        }
+    </style>
+
+    <script>
+        document.addEventListener('alpine:init', () => {
+            Alpine.data('permissions', () => ({
+                init() {
+                    // Inicializar datos desde Livewire
+                    this.$watch('$wire.permissionGroups', value => {
+                        this.groups = value;
+                    });
+                },
+                
+                toggleAll(groupName, enable) {
+                    this.$wire.toggleAllGroupPermissions(groupName, enable);
+                }
+            }));
+        });
+    </script>
+   
+</x-layouts.app>
--- a/routes/web.php
+++ b/routes/web.php
@@ -35,17 +35,29 @@ Route::middleware(['auth', 'verified'])->group(function () {
    // Dashboard
    Route::get('/dashboard', [DashboardController::class, 'index'])->name('dashboard');

+    // Usuarios:
+    Route::get('users/{user}/edit', [UserController::class, 'edit'])->name('users.edit');
+    Route::get('/users/create', [UserController::class, 'create'])->name('users.create')->middleware('can:create-users');
+    // Procesar creación de usuario
+    Route::post('/users', [UserController::class, 'store'])->name('users.store')->middleware('can:create-users');
+    Route::put('/usuarios/{user}', [UserController::class, 'update'])->name('users.update')->middleware('can:update,user'); // Opcional: si usas políticas
+    Route::post('/users', [UserController::class, 'store'])->name('users.store');
+    Route::put('users/{user}', [UserController::class, 'update'])->name('users.update');
+    Route::patch('users/{user}', [UserController::class, 'update']);
+    Route::delete('users/{user}', [UserController::class, 'destroy'])->name('users.destroy');
+    Route::get('users/{user}', [UserController::class, 'show'])->name('users.show');
+    
    // Proyectos
    Route::resource('projects', ProjectController::class);
-    Route::get('/projects/{project}', ProjectController::class)->name('projects.show');
-    Route::get('/projects/{project}', ProjectController::class)->name('projects.show')->middleware('can:view,project'); // Opcional: política de acceso
-    Route::get('/projects/{project}', ProjectShow::class)->name('projects.show');
-    
+    //Route::get('/projects/{project}', ProjectController::class)->name('projects.show');
+    //Route::get('/projects/{project}', ProjectController::class)->name('projects.show')->middleware('can:view,project'); // Opcional: política de acceso
+    Route::get('/projects/{project}', ProjectShow::class)->name('projects.show')->middleware('auth');
    
    // Documentos
    Route::resource('documents', DocumentController::class);
-    Route::post('/documents/{document}/approve', [DocumentController::class, 'approve'])->name('documents.approve');
-    Route::post('/documents/{document}/comment', [DocumentController::class, 'addComment'])->name('documents.comment');
+    Route::post('/documents/{document}', [DocumentController::class, 'show'])->name('documents.show');
+    //Route::post('/documents/{document}/approve', [DocumentController::class, 'approve'])->name('documents.approve');
+    //Route::post('/documents/{document}/comment', [DocumentController::class, 'addComment'])->name('documents.comment');
    
    // Carpetas
    Route::prefix('folders')->group(function () {
--- a/storage/app/public/.gitignore
+++ b/storage/app/public/.gitignore
@@ -1,2 +0,0 @@
-*
-!.gitignore
				`@@ -0,0 +1 @@`
				<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill: rgba(0, 0, 0, 1);transform: ;msFilter:;"><path d="M8.267 14.68c-.184 0-.308.018-.372.036v1.178c.076.018.171.023.302.023.479 0 .774-.242.774-.651 0-.366-.254-.586-.704-.586zm3.487.012c-.2 0-.33.018-.407.036v2.61c.077.018.201.018.313.018.817.006 1.349-.444 1.349-1.396.006-.83-.479-1.268-1.255-1.268z"></path><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6zM9.498 16.19c-.309.29-.765.42-1.296.42a2.23 2.23 0 0 1-.308-.018v1.426H7v-3.936A7.558 7.558 0 0 1 8.219 14c.557 0 .953.106 1.22.319.254.202.426.533.426.923-.001.392-.131.723-.367.948zm3.807 1.355c-.42.349-1.059.515-1.84.515-.468 0-.799-.03-1.024-.06v-3.917A7.947 7.947 0 0 1 11.66 14c.757 0 1.249.136 1.633.426.415.308.675.799.675 1.504 0 .763-.279 1.29-.663 1.615zM17 14.77h-1.532v.911H16.9v.734h-1.432v1.604h-.906V14.03H17v.74zM14 9h-1V4l5 5h-4z"></path></svg>