FileUpload with url

I am uploading my images using a service and it is working fine, But 😦
How can the FileUpload field show a file via url

Forms\Components\FileUpload::make('image_upload')
  ->afterStateUpdated(
      function (Closure $set, Closure $get, TemporaryUploadedFile $state, HandleImagesService $handleImagesService) {
          $set(
              'image_id',
              $handleImagesService->handleImage(
                  null,
                  $state,
                  ModelsNamesWithImages::STATUS_IMAGE,
                  auth()->user()->role->id,
                  $get('force_upload') ?? false
              )->id
          );
      }
  )
  ->afterStateHydrated(
      function (ShowImage $component, Closure $get) {
          if ($get('image_id')) {
              $image = Image::find($get('image_id'));
              $component->state($image->storageLocation->host_name . '/' . $image->file_path);
          }
      }
  ),


 $image->storageLocation->host_name . '/' . $image->file_path 


this gives the right url
Solution
I added the CORS middleware to my FastAPI service and it is working

Last question

When I want to edit the resource, the image dose not appear
I created A custom field (ShowImage) to show the image via URL
Is there a way to display the image inside the FileUpload field without a disk
The FileUpload field is strongly coupled with the Laravel storage facade that's why I have this issue from the beginning
Or my problem is a very specific edge case


Forms\Components\FileUpload::make('image_upload')
    ->getUploadedFileUrlUsing(
        //display uploaded image
        function (Closure $get) {
            if ($get('image_id')) {
                $image = Image::find($get('image_id'));
                return $image->storageLocation->host_name . '/' . $image->file_path;
            }
        }
    )
    ->afterStateUpdated(
        //upload the image
        function (Closure $set, Closure $get, TemporaryUploadedFile $state, HandleImagesService $handleImagesService) {
            $set(
                'image_id',
                $handleImagesService->handleImage(
                    null,
                    $state,
                    ModelsNamesWithImages::STATUS_IMAGE,
                    auth()->user()->role->id,
                    $get('force_upload') ?? false
                )->id
            );
        }
    ),
ShowImage::make('image_show')
    ->afterStateHydrated(
        //display the image
        function (ShowImage $component, Closure $get) {
          if ($get('image_id')) {
              $image = Image::find($get('image_id'));
              $component->state($image->storageLocation->host_name . '/' . $image->file_path);
          }
    })
    ->hidden(function (Page $livewire) {
        return !$livewire instanceof Pages\EditStatusImage;
    }),
Was this page helpful?