Refresh entries list on status change

entries/static/entries/js/components/Entries.js

@@ -9,6 +9,7 @@ export default {
       unifiedFrameId: null,
       isEdit: false,
       gettext: window.gettext,
+      unificationEntriesListRefreshKey: 1
     };
   },
   components: {UnificationEntriesList, UnificationRightPane},
@@ -21,6 +22,9 @@ export default {
     unifiedFrameSelected (unifiedFrameId) {
       this.unifiedFrameId = unifiedFrameId;
       this.isEdit = true;
+    },
+    refreshEntriesList() {
+      this.unificationEntriesListRefreshKey++;
     }
   },
   mounted () {
@@ -43,7 +47,7 @@ export default {
   template: `
     <div id="entries-list" class="col h-100 w-100 px-0">
       <div id="entries-list-div" class="col p-0 h-100 w-100 overflow-auto">
-        <unification-entries-list @lexical-unit-selected="lexicalUnitSelected" />
+        <unification-entries-list :unificationEntriesListRefreshKey="unificationEntriesListRefreshKey" :initialLexicalUnitId="lexicalUnitId" :initialEntryId="entryId" @lexical-unit-selected="lexicalUnitSelected" />
       </div>
     </div>
     <div id="entry-display" class="col h-100 p-0">
@@ -53,7 +57,8 @@ export default {
             :entryId="entryId" 
             :lexicalUnitId="lexicalUnitId" 
             :initialUnifiedFrameId="unifiedFrameId"
-            :initialIsEdit="isEdit" />
+            :initialIsEdit="isEdit" 
+            @refresh-entries-list="refreshEntriesList" />
         </div>
         <div class="col w-100 p-0 tab-pane overflow-auto" id="examples">
             <table id="semantics-examples" class="table table-sm table-hover">

entries/static/entries/js/components/LexicalUnitDisplay.js

@@ -9,7 +9,7 @@ export default {
   data() {
     return { frame: null, unifiedFrame: undefined, gettext: window.gettext, hasPermission: window.has_permission }
   },
-  emits: ['refresh'],
+  emits: ['refresh', "refreshEntriesList"],
   methods: {
     goToEdit (unifiedFrameId, entryId, lexicalUnitId) {
       window.location = `/${lang}/entries/unification?unified_frame_id=${unifiedFrameId}&entry_id=${entryId}&lexical_unit_id=${lexicalUnitId}`;
@@ -20,7 +20,7 @@ export default {
         url: `/${lang}/semantics/frame_mark_as_invalid/${this.frame.id}/`,
         dataType: 'json',
         timeout: 60000,
-      }).then(() => { this.$emit('refresh'); });
+      }).then(() => { this.setup(); this.$emit('refreshEntriesList'); });
     },
     take () {
       $.ajax({
@@ -43,7 +43,7 @@ export default {
         url: `/${lang}/semantics/frame_confirm_invalid/${this.frame.id}/`,
         dataType: 'json',
         timeout: 60000,
-      }).then(() => { this.$emit('refresh'); });
+      }).then(() => { this.setup(); this.$emit('refreshEntriesList'); });
     },
     rejectInvalid () {
       $.ajax({
@@ -51,7 +51,7 @@ export default {
         url: `/${lang}/semantics/frame_reject_invalid/${this.frame.id}/`,
         dataType: 'json',
         timeout: 60000,
-      }).then(() => { this.$emit('refresh'); });
+      }).then(() => { this.setup(); this.$emit('refreshEntriesList'); });
     },
     isReadyToProcess () {
       return (!this.isLeksykograf() && this.unifiedFrame?.status === 'G') || (this.isLeksykograf() && this.frame?.status === 'O');

entries/static/entries/js/components/UnificationEntriesList.js

 export default {
+  props: {
+    initialLexicalUnitId: Number,
+    initialEntryId: Number,
+    unificationEntriesListRefreshKey: Number,
+  },
+  watch: {
+    unificationEntriesListRefreshKey() {
+      setup_entries_list({
+        table: this.$refs.table1,
+        lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); },
+        selectEntryId: this.initialEntryId
+      });
+    }
+  },
   data () {
     return {
       gettext: window.gettext,
@@ -9,7 +23,8 @@ export default {
   mounted () {
     setup_entries_list({
       table: this.$refs.table,
-      lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); }
+      lexicalUnitSelected: (entryId, lexicalUnitId) => { this.$emit('lexicalUnitSelected', entryId, lexicalUnitId); },
+      selectEntryId: this.initialEntryId
     });
   },
   template: `

entries/static/entries/js/components/UnificationRightPane.js

@@ -9,6 +9,7 @@ export default {
     initialUnifiedFrameId: Number,
     initialIsEdit: false,
   },
+  emits: ['refreshEntriesList'],
   data () {
     return this.getInitialData();
   },
@@ -34,6 +35,9 @@ export default {
       this.previewedUnifiedFrameId = this.unifiedFrameId;
       this.unifiedFrameId = previewedUnifiedFrameId;
       this.refresh();
+    },
+    refreshEntriesList() {
+      this.$emit('refreshEntriesList');
     }
   },
   watch: {
@@ -55,6 +59,7 @@ export default {
         :entryId="entryIdLocal"
         :lexicalUnitId="key"
         @refresh="refresh"
+        @refresh-entries-list="refreshEntriesList"
       />
       <lexical-unit-edit
         v-if="unifiedFrameId && isEdit"

entries/static/entries/js/unification_entries_list.js

@@ -18,7 +18,8 @@ function setup_entries_list(options) {
             { data: 'POS' },
             { render: data => (data && data.lexical_units && data.lexical_units.some(lu => lu.assignee_username !== null)) ? gettext("nie") : gettext("tak") },
             can_see_assignees ? { data: 'assignee_username' } : { render: is_assigned_to_user_renderer },
-        ]
+        ],
+        selectEntryId: options.selectEntryId,
     });
     datatable.on('click', 'tr.entry', function () {
         var row = datatable.row(this);