feat: add remaining permission checks for note editor fields

refs #247

src/Pages/ShowEpisodeDetails.vue

@@ -22,14 +22,17 @@
         </label>
       </template>
 
-      <APlaylistEditor
-        :playlist="playlist"
-        :required-duration-seconds="calculateDurationSeconds(timeslot.start, timeslot.end)"
-        :show="show"
-        :use-expert-mode="usePlaylistEditorExpertMode"
-        class="tw-max-w-3xl"
-        @create="assignPlaylistToTimeslot"
-      />
+      <APermissionGuard v-slot="{ disabled }" edit-permissions="program.edit__timeslot__playlist">
+        <APlaylistEditor
+          :playlist="playlist"
+          :required-duration-seconds="calculateDurationSeconds(timeslot.start, timeslot.end)"
+          :show="show"
+          :use-expert-mode="usePlaylistEditorExpertMode"
+          :disabled="disabled"
+          class="tw-max-w-3xl"
+          @create="assignPlaylistToTimeslot"
+        />
+      </APermissionGuard>
     </ASection>
 
     <hr />
@@ -56,6 +59,7 @@ import PageHeader from '@/components/PageHeader.vue'
 import NoteDescriptionEditor from '@/components/shows/NoteDescriptionEditor.vue'
 import ASection from '@/components/generic/ASection.vue'
 import ATimeEditInfo from '@/components/generic/ATimeEditInfo.vue'
+import APermissionGuard from '@/components/generic/APermissionGuard.vue'
 import APlaylistEditor from '@/components/playlist/APlaylistEditor.vue'
 
 const props = defineProps<{

src/components/shows/NoteDescriptionEditor.vue

@@ -5,6 +5,7 @@
       :label="t('noteEditor.title')"
       :errors="title.errors"
       :is-saving="title.isSaving"
+      edit-permissions="program.edit__note__title"
     >
       <input
         v-model="title.value"
@@ -19,50 +20,62 @@
     </FormGroup>
 
     <FormGroup
-      v-slot="{ id }"
+      v-slot="{ id, disabled }"
       :label="t('noteEditor.summary')"
       :errors="summary.errors"
       :is-saving="summary.isSaving"
+      edit-permissions="program.edit__note__summary"
       custom-control
     >
       <AHTMLEditor
         :id="id"
         v-model="summary.value"
+        :disabled="disabled"
         :placeholder="t('noteEditor.summaryPlaceholder')"
         @blur="summary.save()"
       />
     </FormGroup>
 
     <FormGroup
-      v-slot="{ id }"
+      v-slot="{ id, disabled }"
       :label="t('noteEditor.content')"
       :errors="content.errors"
       :is-saving="content.isSaving"
+      edit-permissions="program.edit__note__content"
       custom-control
     >
       <AHTMLEditor
         :id="id"
         v-model="content.value"
+        :disabled="disabled"
         :placeholder="t('noteEditor.contentPlaceholder')"
         @blur="content.save()"
       />
     </FormGroup>
 
     <FormGroup
+      v-slot="{ disabled }"
       :label="t('noteEditor.image')"
       :errors="imageId.errors"
       :is-saving="imageId.isSaving"
+      edit-permissions="program.edit__note__image"
       custom-control
     >
-      <ImagePicker v-model="imageId.value" class="tw-flex-none tw-w-min" />
+      <ImagePicker v-model="imageId.value" :disabled="disabled" class="tw-flex-none tw-w-min" />
     </FormGroup>
 
     <FormGroup
+      v-slot="{ disabled }"
       :label="t('noteEditor.contributors')"
       :errors="contributors.errors"
       :is-saving="contributors.isSaving"
+      edit-permissions="program.edit__note__contributors"
     >
-      <ComboBoxSimple v-model="contributors.value" :choices="contributors.choices" />
+      <ComboBoxSimple
+        v-model="contributors.value"
+        :choices="contributors.choices"
+        :disabled="disabled"
+      />
     </FormGroup>
 
     <FormGroup
@@ -70,7 +83,7 @@
       :label="t('noteEditor.topics')"
       :errors="topics.errors"
       :is-saving="topics.isSaving"
-      edit-permissions="program.edit__note__topic"
+      edit-permissions="program.edit__note__topics"
     >
       <ComboBoxSimple v-model="topics.value" :choices="topics.choices" :disabled="disabled" />
     </FormGroup>
@@ -80,25 +93,34 @@
       :label="t('noteEditor.languages')"
       :errors="languages.errors"
       :is-saving="languages.isSaving"
-      edit-permissions="program.edit__note__language"
+      edit-permissions="program.edit__note__languages"
     >
       <ComboBoxSimple v-model="languages.value" :choices="languages.choices" :disabled="disabled" />
     </FormGroup>
 
-    <FormGroup :label="t('noteEditor.tags')" :errors="tags.errors" :is-saving="tags.isSaving">
-      <TagInput v-model="tags.value" />
+    <FormGroup
+      v-slot="{ disabled }"
+      :label="t('noteEditor.tags')"
+      :errors="tags.errors"
+      :is-saving="tags.isSaving"
+      edit-permissions="program.edit__note__tags"
+    >
+      <TagInput v-model="tags.value" :disabled="disabled" />
     </FormGroup>
 
     <FormGroup
+      v-slot="{ disabled }"
       :label="t('noteEditor.links')"
       :is-saving="links.isSaving"
       :errors="links.errors.forField('links', '')"
       :has-error="links.errors.length > 0"
+      edit-permissions="program.edit__note__links"
       custom-control
     >
       <ALinkCollectionEditor
         v-model="links.value"
         :error-lists="links.errors.siblings('links')"
+        :disabled="disabled"
         allow-add
         @save="links.save()"
       />
@@ -138,7 +160,7 @@ const note = computed(() => props.note)
 const title = useAPIObjectFieldCopy(noteStore, note, 'title', { debounce: 2 })
 const summary = useAPIObjectFieldCopy(noteStore, note, 'summary', { noAutoSave: true })
 const content = useAPIObjectFieldCopy(noteStore, note, 'content', { noAutoSave: true })
-const tags = useAPIObjectFieldCopy(noteStore, note, 'tags')
+const tags = useAPIObjectFieldCopy(noteStore, note, 'tags', { debounce: 0 })
 const imageId = useAPIObjectFieldCopy(noteStore, note, 'imageId', { debounce: 0 })
 const links = useAPIObjectFieldCopy(noteStore, note, 'links', { debounce: 2 })
 const contributors = useRelationList(noteStore, note, 'contributorIds', hostStore)