fix: validate slug length when submitting episode form + clean permalink edit prefix

app/Resources/js/modules/permalink-edit.ts

@@ -25,6 +25,9 @@ export class PermalinkEdit extends LitElement {
   @property({ attribute: "copy-label" })
   copyLabel = "Copy";
 
+  @property({ attribute: "permalink-base" })
+  permalinkBase = "";
+
   @state()
   isEditable = false;
 
@@ -68,6 +71,8 @@ export class PermalinkEdit extends LitElement {
   }
 
   firstUpdated(): void {
+    this.permalinkBase += this.permalinkBase.endsWith("/") ? "" : "/";
+
     // set permalink value
     this.setPermalink();
 
@@ -130,7 +135,7 @@ export class PermalinkEdit extends LitElement {
   }
 
   setPermalink(): void {
-    this.permalink = this._domain[0].innerHTML + this._slugInput[0].value;
+    this.permalink = this.permalinkBase + this._slugInput[0].value;
   }
 
   static styles = css`

modules/Admin/Controllers/EpisodeController.php

@@ -135,6 +135,7 @@ class EpisodeController extends BaseController
     public function attemptCreate(): RedirectResponse
     {
         $rules = [
+            'slug' => 'max_length[128]',
             'audio_file' => 'uploaded[audio_file]|ext_in[audio_file,mp3,m4a]',
             'cover' =>
                 'is_image[cover]|ext_in[cover,jpg,png]|min_dims[cover,1400,1400]|is_image_ratio[cover,1,1]',
@@ -272,6 +273,7 @@ class EpisodeController extends BaseController
     public function attemptEdit(): RedirectResponse
     {
         $rules = [
+            'slug' => 'max_length[128]',
             'audio_file' =>
                 'uploaded[audio_file]|ext_in[audio_file,mp3,m4a]|permit_empty',
             'cover' =>

themes/cp_admin/episode/create.php

@@ -45,8 +45,8 @@
 
 <div>
     <Forms.Label for="slug"><?= lang('Episode.form.permalink') ?></Forms.Label>
-    <permalink-edit class="inline-flex items-center text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>">
-        <span slot="domain"><?= base_url('/@' . esc($podcast->handle) . '/episodes') . '/' ?></span>
+    <permalink-edit class="inline-flex items-center w-full text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>" permalink-base="<?= url_to('podcast-episodes', $podcast->handle) ?>">
+        <span slot="domain"><?= '…/' . esc($podcast->at_handle) . '/' ?></span>
         <Forms.Input name="slug" required="true" data-slugify="slug" slot="slug-input" class="flex-1 text-xs" />
     </permalink-edit>
 </div>

themes/cp_admin/episode/edit.php

@@ -49,8 +49,8 @@
 
 <div>
     <Forms.Label for="slug"><?= lang('Episode.form.permalink') ?></Forms.Label>
-    <permalink-edit class="inline-flex items-center text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>">
-        <span slot="domain"><?= base_url('/@' . esc($podcast->handle) . '/episodes') . '/' ?></span>
+    <permalink-edit class="inline-flex items-center w-full text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>" permalink-base="<?= url_to('podcast-episodes', esc($podcast->handle)) ?>">
+        <span slot="domain"><?= '…/' . esc($podcast->handle) . '/' ?></span>
         <Forms.Input name="slug" value="<?= esc($episode->slug) ?>" required="true" data-slugify="slug" slot="slug-input" class="flex-1 text-xs" />
     </permalink-edit>
 </div>

themes/cp_admin/page/create.php

@@ -23,8 +23,8 @@
 
 <div class="flex flex-col max-w-sm">
     <Forms.Label for="slug"><?= lang('Page.form.permalink') ?></Forms.Label>
-    <permalink-edit class="inline-flex items-center text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>">
-        <span slot="domain" class="flex-shrink-0"><?= base_url('pages') . '/' ?></span>
+    <permalink-edit class="inline-flex items-center w-full text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>" permalink-base="<?= base_url('pages') ?>">
+        <span slot="domain" class="flex-shrink-0">…/pages/</span>
         <Forms.Input name="slug" required="true" data-slugify="slug" slot="slug-input" class="flex-1 text-xs" />
     </permalink-edit>
 </div>

themes/cp_admin/page/edit.php

@@ -25,8 +25,8 @@
 
 <div class="flex flex-col max-w-sm">
     <Forms.Label for="slug"><?= lang('Page.form.permalink') ?></Forms.Label>
-    <permalink-edit class="inline-flex items-center text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>">
-        <span slot="domain" class="flex-shrink-0"><?= base_url('pages') . '/' ?></span>
+    <permalink-edit class="inline-flex items-center text-xs" edit-label="<?= lang('Common.edit') ?>" copy-label="<?= lang('Common.copy') ?>" copied-label="<?= lang('Common.copied') ?>" permalink-base="<?= base_url('pages') ?>">
+        <span slot="domain" class="flex-shrink-0">…/pages/<span>
         <Forms.Input name="slug" value="<?= esc($page->slug) ?>" required="true" data-slugify="slug" slot="slug-input" class="flex-1 text-xs" value="<?= esc($page->slug) ?>"/>
     </permalink-edit>
 </div>