cargar carpeta con html, css y js a mi base de datos con storeAs , y relacion polimorfica en larevel livewire

Aquí te dejo un ejemplo de cómo cargar una carpeta con archivos HTML, CSS y JS a tu base de datos utilizando Laravel Livewire y la función `storeAs` para guardar los archivos en el servidor.

Primero, debes crear un modelo para almacenar la información de la carpeta y sus archivos. Llamemos a este modelo `Archivo`.

```php
// app/Models/Archivo.php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Factories\HasFactory;

class Archivo extends Model
{
    use HasFactory;

    protected $fillable = [
        'nombre',
        'ruta',
        'tipo',
        'contenido',
    ];

    public function carpeta()
    {
        return $this->belongsTo(Carpeta::class);
    }
}
```

Luego, debes crear un modelo para almacenar la información de la carpeta.

```php
// app/Models/Carpeta.php

namespace App\Models;

use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\Factories\HasFactory;

class Carpeta extends Model
{
    use HasFactory;

    protected $fillable = [
        'nombre',
        'ruta',
    ];

    public function archivos()
    {
        return $this->hasMany(Archivo::class);
    }
}
```

Ahora, debes crear un componente Livewire para cargar la carpeta y sus archivos.

```php
// resources/views/components/cargar-carpeta.blade.php

<x-jet-form-section>
    <x-slot name="title">
        Cargar Carpeta
    </x-slot>

    <x-slot name="description">
        Carga una carpeta con archivos HTML, CSS y JS a tu base de datos.
    </x-slot>

    <x-slot name="form">
        <div class="col-span-6 sm:col-span-4">
            <x-jet-label for="nombre" value="{{ __('Nombre de la carpeta') }}" />
            <x-jet-input id="nombre" type="text" class="mt-1 block w-full" wire:model.defer="nombre" />
            <x-jet-input-error for="nombre" />
        </div>

        <div class="col-span-6 sm:col-span-4">
            <x-jet-label for="ruta" value="{{ __('Ruta de la carpeta') }}" />
            <x-jet-input id="ruta" type="text" class="mt-1 block w-full" wire:model.defer="ruta" />
            <x-jet-input-error for="ruta" />
        </div>

        <div class="col-span-6 sm:col-span-4">
            <x-jet-label for="archivo_html" value="{{ __('Archivo HTML') }}" />
            <x-jet-input id="archivo_html" type="file" class="mt-1 block w-full" wire:model.defer="archivo_html" />
            <x-jet-input-error for="archivo_html" />
        </div>

        <div class="col-span-6 sm:col-span-4">
            <x-jet-label for="archivo_css" value="{{ __('Archivo CSS') }}" />
            <x-jet-input id="archivo_css" type="file" class="mt-1 block w-full" wire:model.defer="archivo_css" />
            <x-jet-input-error for="archivo_css" />
        </div>

        <div class="col-span-6 sm:col-span-4">
            <x-jet-label for="archivo_js" value="{{ __('Archivo JS') }}" />
            <x-jet-input id="archivo_js" type="file" class="mt-1 block w-full" wire:model.defer="archivo_js" />
            <x-jet-input-error for="archivo_js" />
        </div>

        <div class="mt-4">
            <x-jet-button wire:click="cargarCarpeta">
                Cargar Carpeta
            </x-jet-button>
        </div>
    </x-slot>
</x-jet-form-section>
```

Luego, debes crear un componente Livewire para manejar la lógica de carga de la carpeta y sus archivos.

```php
// app/Http/Livewire/CargarCarpeta.php

namespace App\Http\Livewire;

use Livewire\Component;
use Livewire\WithFileUploads;
use App\Models\Archivo;
use App\Models\Carpeta;

class CargarCarpeta extends Component
{
    use WithFileUploads;

    public $nombre;
    public $ruta;
    public $archivo_html;
    public $archivo_css;
    public $archivo_js;

    public function render()
    {
        return view('livewire.cargar-carpeta');
    }

    public function cargarCarpeta()
    {
        $carpeta = new Carpeta();
        $carpeta->nombre = $this->nombre;
        $carpeta->ruta = $this->ruta;
        $carpeta->save();

        $archivo_html = new Archivo();
        $archivo_html->nombre = 'index.html';
        $archivo_html->ruta = $this->ruta . '/index.html';
        $archivo_html->tipo = 'text/html';
        $archivo_html->contenido = file_get_contents($this->archivo_html->tempName());
        $archivo_html->carpeta_id = $carpeta->id;
        $archivo_html->save();

        $archivo_css = new Archivo();
        $archivo_css->nombre = 'estilos.css';
        $archivo_css->ruta = $this->ruta . '/estilos.css';
        $archivo_css->tipo = 'text/css';
        $archivo_css->contenido = file_get_contents($this->archivo_css->tempName());
        $archivo_css->carpeta_id = $carpeta->id;
        $archivo_css->save();

        $archivo_js = new Archivo();
        $archivo_js->nombre = 'script.js';
        $archivo_js->ruta = $this->ruta . '/script.js';
        $archivo_js->tipo = 'application/javascript';
        $archivo_js->contenido = file_get_contents($this->archivo_js->tempName());
        $archivo_js->carpeta_id = $carpeta->id;
        $archivo_js->save();

        $this->reset('nombre', 'ruta', 'archivo_html', 'archivo_css', 'archivo_js');
    }
}
```

Finalmente, debes agregar el componente Livewire a tu vista principal.

```php
// resources/views/app.blade.php

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Cargar Carpeta') }}
        </h2>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 bg-white border-b border-gray-200">
                    <livewire:cargar-carpeta />
                </div>
            </div>
        </div>
    </div>
</x-app-layout>
```

Con esto, deberías poder cargar una carpeta con archivos HTML, CSS y JS a tu base de datos utilizando Laravel Livewire y la función `storeAs` para guardar los archivos en el servidor.