Delete related clips when a file is deleted

src/store/index.js

@@ -390,10 +390,28 @@ export default createStore({
         commit('addError', err.response.data)
       }
     },
-    async deleteFile({commit}, file_id) {
+    async deleteFile({commit, dispatch, state}, file_id) {
+      const normalizedFileId = typeof file_id === 'number' ? file_id : Number(file_id)
+      const relatedClips = state.clips.filter(clip => {
+        let clipFileId = clip?.fileObj?.id
+        if (!clipFileId && clip?.file) {
+          if (typeof clip.file === 'string') {
+            const parts = clip.file.split('/').filter(Boolean)
+            clipFileId = Number(parts[parts.length - 1])
+          } else if (typeof clip.file === 'number') {
+            clipFileId = clip.file
+          }
+        }
+        return clipFileId === normalizedFileId
+      })
+
+      for (const clip of relatedClips) {
+        await dispatch('deleteClip', clip.id)
+      }
+
       try {
         await instance.delete(`files/${file_id}/`)
-        commit('deleteFile', file_id)
+        commit('deleteFile', normalizedFileId)
       } catch(err) {
         commit('addError', err.response.data)
       }