Cook and Prep time on recipe card

.phpstorm.meta.php

@@ -197,6 +197,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -445,6 +448,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -693,6 +699,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -941,6 +950,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -1189,6 +1201,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -1437,6 +1452,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -1685,6 +1703,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -1933,6 +1954,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -2181,6 +2205,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -2429,6 +2456,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,
@@ -2677,6 +2707,9 @@
             'Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder' => \Spatie\LaravelIgnition\Recorders\LogRecorder\LogRecorder::class,
             'Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder' => \Spatie\LaravelIgnition\Recorders\QueryRecorder\QueryRecorder::class,
             'Spatie\LaravelIgnition\Support\SentReports' => \Spatie\LaravelIgnition\Support\SentReports::class,
+            'Spatie\MediaLibrary\MediaCollections\MediaRepository' => \Spatie\MediaLibrary\MediaCollections\MediaRepository::class,
+            'Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\TinyPlaceholderGenerator' => \Spatie\MediaLibrary\ResponsiveImages\TinyPlaceholderGenerator\Blurred::class,
+            'Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\WidthCalculator' => \Spatie\MediaLibrary\ResponsiveImages\WidthCalculator\FileSizeOptimizedWidthCalculator::class,
             'auth' => \Illuminate\Auth\AuthManager::class,
             'auth.driver' => \Illuminate\Auth\SessionGuard::class,
             'auth.password' => \Illuminate\Auth\Passwords\PasswordBrokerManager::class,

_ide_helper_models.php

@@ -43,32 +43,6 @@
 	class Category extends \Eloquent implements \Spatie\EloquentSortable\Sortable {}
 }
 
-namespace App\Models{
-/**
- * 
- *
- * @property int $id
- * @property string $name
- * @property string|null $description
- * @property string $path
- * @property \Illuminate\Support\Carbon|null $created_at
- * @property \Illuminate\Support\Carbon|null $updated_at
- * @property-read \Illuminate\Database\Eloquent\Collection<int, \App\Models\Recipe> $recipes
- * @property-read int|null $recipes_count
- * @method static \Database\Factories\ImageFactory factory($count = null, $state = [])
- * @method static \Illuminate\Database\Eloquent\Builder|Image newModelQuery()
- * @method static \Illuminate\Database\Eloquent\Builder|Image newQuery()
- * @method static \Illuminate\Database\Eloquent\Builder|Image query()
- * @method static \Illuminate\Database\Eloquent\Builder|Image whereCreatedAt($value)
- * @method static \Illuminate\Database\Eloquent\Builder|Image whereDescription($value)
- * @method static \Illuminate\Database\Eloquent\Builder|Image whereId($value)
- * @method static \Illuminate\Database\Eloquent\Builder|Image whereName($value)
- * @method static \Illuminate\Database\Eloquent\Builder|Image wherePath($value)
- * @method static \Illuminate\Database\Eloquent\Builder|Image whereUpdatedAt($value)
- */
-	class Image extends \Eloquent {}
-}
-
 namespace App\Models{
 /**
  * 
@@ -109,6 +83,9 @@ class Label extends \Eloquent implements \Spatie\EloquentSortable\Sortable {}
  * @property string $name
  * @property string $slug
  * @property string $serving
+ * @property int $prep_time
+ * @property int $cook_time
+ * @property int $total_time
  * @property string $ingredients
  * @property string $instructions
  * @property string|null $description
@@ -119,31 +96,37 @@ class Label extends \Eloquent implements \Spatie\EloquentSortable\Sortable {}
  * @property \Illuminate\Support\Carbon|null $deleted_at
  * @property-read \Illuminate\Database\Eloquent\Collection<int, \App\Models\Category> $categories
  * @property-read int|null $categories_count
- * @property-read \App\Models\Image|null $images
+ * @property-read mixed $hero
+ * @property-read mixed $hero_preview
  * @property-read \Illuminate\Database\Eloquent\Collection<int, \App\Models\Label> $labels
  * @property-read int|null $labels_count
+ * @property-read \Spatie\MediaLibrary\MediaCollections\Models\Collections\MediaCollection<int, \Spatie\MediaLibrary\MediaCollections\Models\Media> $media
+ * @property-read int|null $media_count
  * @property-read \App\Models\User|null $user
  * @method static \Database\Factories\RecipeFactory factory($count = null, $state = [])
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe newModelQuery()
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe newQuery()
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe onlyTrashed()
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe query()
+ * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereCookTime($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereCreatedAt($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereDeletedAt($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereDescription($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereId($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereIngredients($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereInstructions($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereName($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|Recipe wherePrepTime($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe wherePublishedAt($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereServing($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereSlug($value)
+ * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereTotalTime($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereUpdatedAt($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe whereUserId($value)
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe withTrashed()
  * @method static \Illuminate\Database\Eloquent\Builder|Recipe withoutTrashed()
  */
-	class Recipe extends \Eloquent {}
+	class Recipe extends \Eloquent implements \Spatie\MediaLibrary\HasMedia {}
 }
 
 namespace App\Models{

app/Providers/AppServiceProvider.php

@@ -6,6 +6,7 @@
 use Barryvdh\LaravelIdeHelper\IdeHelperServiceProvider;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Http\RedirectResponse;
+use Illuminate\Support\Facades\URL;
 use Illuminate\Support\ServiceProvider;
 
 class AppServiceProvider extends ServiceProvider
@@ -17,6 +18,9 @@ public function register(): void
     {
         Model::preventLazyLoading(! app()->isProduction());
         Model::preventAccessingMissingAttributes(! app()->isProduction());
+        if (app()->isProduction()) {
+            URL::forceScheme('https');
+        }
 
         // @codeCoverageIgnoreStart
         if ($this->app->isLocal()) {

package.json

@@ -21,6 +21,7 @@
   },
   "dependencies": {
     "marked": "^12.0.1",
+    "pluralize": "^8.0.0",
     "primeicons": "^6.0.1",
     "primevue": "^3.49.1"
   }

resources/js/Components/RecipeCard.vue

@@ -1,6 +1,7 @@
 <script setup>
 import Skeleton from "primevue/skeleton";
 import {Link, router} from "@inertiajs/vue3";
+import pluralize from "pluralize";
 
 defineProps({
     recipe: {
@@ -12,6 +13,16 @@ defineProps({
         default: false,
     }
 });
+
+const humanReadableDuration = (durationInMinutes) => {
+    const hours = Math.floor(durationInMinutes / 60);
+    const minutes = Math.floor(durationInMinutes % 60);
+    const phrases = [];
+    phrases.push((hours > 0) ? `${hours}H` : null)
+    phrases.push((minutes > 0) ? `${minutes}M` : null)
+
+    return phrases.filter(e => e).join(" ");
+}
 </script>
 
 <template>
@@ -54,7 +65,7 @@ defineProps({
                     d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
                 />
             </svg>
-            <span class="ml-1">{{ recipe.total_time }} m</span>
+            <span class="ml-1">{{ humanReadableDuration(recipe.total_time) }}</span>
         </div>
         <Link v-if="! skeleton" :href="route('recipe.show', {recipe: recipe.slug})" class="absolute inset-0"></Link>
     </div>