@konfuzio/document-validation-ui 0.1.49-dev.0 → 0.1.49-dev.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/css/app.css +1 -1
  2. package/dist/index.html +1 -1
  3. package/dist/js/app.js +1 -1
  4. package/dist/js/app.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/api.js +1 -0
  7. package/src/components/App.vue +17 -0
  8. package/src/components/DocumentTopBar/DocumentTopBar.cy.js +192 -220
  9. package/src/components/DocumentTopBar/DocumentTopBar.vue +9 -7
  10. package/src/store/category.js +13 -21
  11. package/src/store/display.js +8 -0
  12. package/src/store/document.js +0 -18
  13. package/src/store/project.js +31 -22
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@konfuzio/document-validation-ui",
3
- "version": "0.1.49-dev.0",
3
+ "version": "0.1.49-dev.1",
4
4
  "repository": "git://github.com:konfuzio-ai/document-validation-ui.git",
5
5
  "main": "dist/app.js",
6
6
  "scripts": {
package/src/api.js CHANGED
@@ -102,6 +102,7 @@ const makeGetPaginatedRequest = (request, hasParams = false) => {
102
102
  }
103
103
  } catch (error) {
104
104
  reject(error);
105
+ toFinishLoop = true;
105
106
  console.log(error);
106
107
  }
107
108
  } while (!toFinishLoop);
package/src/components/App.vue CHANGED
@@ -47,6 +47,12 @@ export default {
47
47
  default: "false",
48
48
  },
49
49
  // eslint-disable-next-line vue/prop-name-casing
50
+ show_documents_navigation: {
51
+ type: String,
52
+ required: false,
53
+ default: "true",
54
+ },
55
+ // eslint-disable-next-line vue/prop-name-casing
50
56
  sentry_dsn: {
51
57
  type: String,
52
58
  required: false,
@@ -157,6 +163,13 @@ export default {
157
163
  return null;
158
164
  }
159
165
  },
166
+ showDocumentsNavigation() {
167
+ if (process.env.VUE_APP_SHOW_DOCUMENTS_NAVIGATION) {
168
+ return process.env.VUE_APP_SHOW_DOCUMENTS_NAVIGATION === "true";
169
+ } else {
170
+ return this.show_documents_navigation === "true";
171
+ }
172
+ },
160
173
  isPublicView() {
161
174
  if (
162
175
  this.userToken ||
@@ -296,6 +309,10 @@ export default {
296
309
  "display/hideEmptyLabelSets",
297
310
  this.hideEmptyLabelSets
298
311
  ),
312
+ this.$store.dispatch(
313
+ "display/showDocumentsNavigation",
314
+ this.showDocumentsNavigation
315
+ ),
299
316
  this.$store.dispatch("document/setDocId", this.documentId),
300
317
  this.$store.dispatch("document/setPublicView", this.isPublicView),
301
318
  this.$store.dispatch("document/setAnnotationId", this.annotationId),
package/src/components/DocumentTopBar/DocumentTopBar.cy.js CHANGED
@@ -1,223 +1,195 @@
1
1
  import DocumentTopBar from "./DocumentTopBar";
2
2
 
3
3
  describe("Document Top Bar", () => {
4
- let currentDocument;
5
-
6
- beforeEach(() => {
7
- cy.fetchDocument().then(() => {
8
- cy.getStore("document")
9
- .then($document => {
10
- currentDocument = $document.selectedDocument;
11
- });
12
-
13
- cy.getStore("project")
14
- .then($project => {
15
- cy.fetchCategories($project.projectId);
16
- });
17
- });
18
- cy.dispatchAction("document", "setPublicView", false);
19
- cy.dispatchAction("edit", "disableEditMode");
20
- cy.mount(DocumentTopBar);
21
- });
22
-
23
- it("Shows category dropdown if not edit mode or reviewed", () => {
24
- cy.dispatchAction("edit", "disableEditMode");
25
-
26
- cy.get("#document-top-bar-component")
27
- .find(".left-bar-components")
28
- .find(".category-chooser")
29
- .should("be.visible");
30
- });
31
-
32
- it("Shows correct file name", () => {
33
- const fileName = currentDocument.data_file_name;
34
-
35
- cy.get("#document-top-bar-component")
36
- .find(".center-bar-components")
37
- .find(".document-name-component")
38
- .should("be.visible");
39
-
40
- cy.get("#document-top-bar-component")
41
- .find(".center-bar-components")
42
- .find(".document-name-component")
43
- .find(".document-name")
44
- .contains(fileName);
45
- });
46
-
47
- it("Shows arrows if available documents to navigate to", () => {
48
- cy.fetchDocumentList();
49
- const assignee = currentDocument.assignee;
50
-
51
- cy.getStore("project")
52
- .then($project => {
53
- cy.gettersStore().then(($getters) => {
54
- const filtered = $project.documentsInProject.filter(
55
- (document) =>
56
- ($getters["document/waitingForSplittingConfirmation"](document) || $getters["document/isDocumentReadyToBeReviewed"](document)
57
- ) && document.assignee === assignee
58
- );
59
-
60
- if (filtered.length > 0) {
61
- cy.get("#document-top-bar-component")
62
- .find(".center-bar-components")
63
- .find(".navigation-arrow")
64
- .should("be.visible");
65
- }
66
- });
67
- });
68
- });
69
-
70
- it("Shows keyboard icon", () => {
71
- cy.get("#document-top-bar-component")
72
- .find(".right-bar-components")
73
- .find(".keyboard-actions-info")
74
- .should("be.visible");
75
- });
76
-
77
- it("Shows disabled finish review button", () => {
78
- cy.get("#document-top-bar-component")
79
- .find(".right-bar-components")
80
- .find(".top-bar-buttons")
81
- .find(".finish-review-button-container")
82
- .should("be.visible");
83
-
84
- cy.get("#document-top-bar-component")
85
- .find(".right-bar-components")
86
- .find(".top-bar-buttons")
87
- .find(".finish-review-button-container")
88
- .find(".finish-review-btn")
89
- .should("be.disabled");
90
- });
91
-
92
- it("Shows edit mode buttons", () => {
93
- cy.dispatchAction("edit", "enableEditMode");
94
-
95
- cy.get("#document-top-bar-component")
96
- .find(".right-bar-components")
97
- .find(".top-bar-buttons")
98
- .find(".finish-review-button-container")
99
- .should("not.exist");
100
-
101
- cy.get("#document-top-bar-component")
102
- .find(".right-bar-components")
103
- .find(".top-bar-buttons")
104
- .find(".edit-mode-buttons")
105
- .should("be.visible");
106
- });
107
-
108
- it("Edits file name", () => {
109
- const newName = "test-name";
110
-
111
- cy.get("#document-top-bar-component")
112
- .find(".center-bar-components")
113
- .find(".document-name-component")
114
- .find(".edit-btn")
115
- .click();
116
-
117
- cy.get("#document-top-bar-component")
118
- .find(".center-bar-components")
119
- .find(".document-name-component")
120
- .find(".document-name")
121
- .should("have.class", "is-editable");
122
-
123
- cy.get("#document-top-bar-component")
124
- .find(".center-bar-components")
125
- .find(".document-name-component")
126
- .find(".document-name")
127
- .type('{selectAll}')
128
- .type('{backspace}')
129
- .type(newName);
130
-
131
- cy.get("#document-top-bar-component")
132
- .find(".center-bar-components")
133
- .find(".document-name-component")
134
- .find(".save-btn")
135
- .should("be.visible");
136
-
137
- cy.get("#document-top-bar-component")
138
- .find(".center-bar-components")
139
- .find(".document-name-component")
140
- .find(".save-btn")
141
- .click();
142
-
143
- cy.wait(1000);
144
-
145
- cy.get("#document-top-bar-component")
146
- .find(".center-bar-components")
147
- .find(".document-name-component")
148
- .find(".cloud-icon")
149
- .should("be.visible");
150
-
151
- cy.wait(1000);
152
-
153
- cy.get("#document-top-bar-component")
154
- .find(".center-bar-components")
155
- .find(".document-name-component")
156
- .contains(newName);
157
- });
158
-
159
- it("Shows tooltip when hovering over keyboard info", () => {
160
- cy.get("#document-top-bar-component")
161
- .find(".right-bar-components")
162
- .find(".keyboard-actions-info")
163
- .trigger("mouseenter");
164
-
165
- cy.get("#document-top-bar-component")
166
- .find(".right-bar-components")
167
- .find(".keyboard-actions-info")
168
- .find(".keyboard-actions-description")
169
- .should("be.visible");
170
-
171
- cy.get("#document-top-bar-component")
172
- .find(".right-bar-components")
173
- .find(".keyboard-actions-info")
174
- .trigger("mouseleave");
175
- });
176
-
177
- it("Closes edit mode when clicking 'back to annotation view' button", () => {
178
- cy.dispatchAction("edit", "enableEditMode");
179
-
180
- cy.get("#document-top-bar-component")
181
- .find(".right-bar-components")
182
- .find(".edit-mode-buttons")
183
- .should("exist");
184
-
185
- cy.get("#document-top-bar-component")
186
- .find(".right-bar-components")
187
- .find(".edit-mode-buttons")
188
- .find(".button-cancel")
189
- .then(($button) => {
190
- if (!$button.is(':disabled')) {
191
- cy.wrap($button)
192
- .click();
193
-
194
- cy.wait(1000);
195
-
196
- cy.get("#document-top-bar-component")
197
- .find(".right-bar-components")
198
- .find(".edit-mode-buttons")
199
- .should("not.exist");
200
- }
201
-
202
- });
203
-
204
- });
205
-
206
- it("Shows rename and categorize section when clicking 'next' button", () => {
207
- cy.dispatchAction("edit", "enableEditMode");
208
-
209
- cy.get("#document-top-bar-component")
210
- .find(".right-bar-components")
211
- .find(".edit-mode-buttons")
212
- .find(".button-next")
213
- .click();
214
-
215
- cy.wait(1000);
216
-
217
- cy.get("#document-top-bar-component")
218
- .find(".right-bar-components")
219
- .find(".edit-mode-buttons")
220
- .find(".submit-btn")
221
- .should("be.visible");
222
- });
223
- });
4
+ let currentDocument;
5
+
6
+ beforeEach(() => {
7
+ cy.fetchDocument().then(() => {
8
+ cy.getStore("document").then(($document) => {
9
+ currentDocument = $document.selectedDocument;
10
+ });
11
+
12
+ cy.getStore("project").then(($project) => {
13
+ cy.fetchCategories($project.projectId);
14
+ });
15
+ });
16
+ cy.dispatchAction("document", "setPublicView", false);
17
+ cy.dispatchAction("edit", "disableEditMode");
18
+ cy.mount(DocumentTopBar);
19
+ });
20
+
21
+ it("Shows category dropdown if not edit mode or reviewed", () => {
22
+ cy.dispatchAction("edit", "disableEditMode");
23
+
24
+ cy.get("#document-top-bar-component")
25
+ .find(".left-bar-components")
26
+ .find(".category-chooser")
27
+ .should("be.visible");
28
+ });
29
+
30
+ it("Shows correct file name", () => {
31
+ const fileName = currentDocument.data_file_name;
32
+
33
+ cy.get("#document-top-bar-component")
34
+ .find(".center-bar-components")
35
+ .find(".document-name-component")
36
+ .should("be.visible");
37
+
38
+ cy.get("#document-top-bar-component")
39
+ .find(".center-bar-components")
40
+ .find(".document-name-component")
41
+ .find(".document-name")
42
+ .contains(fileName);
43
+ });
44
+
45
+ it("Shows keyboard icon", () => {
46
+ cy.get("#document-top-bar-component")
47
+ .find(".right-bar-components")
48
+ .find(".keyboard-actions-info")
49
+ .should("be.visible");
50
+ });
51
+
52
+ it("Shows disabled finish review button", () => {
53
+ cy.get("#document-top-bar-component")
54
+ .find(".right-bar-components")
55
+ .find(".top-bar-buttons")
56
+ .find(".finish-review-button-container")
57
+ .should("be.visible");
58
+
59
+ cy.get("#document-top-bar-component")
60
+ .find(".right-bar-components")
61
+ .find(".top-bar-buttons")
62
+ .find(".finish-review-button-container")
63
+ .find(".finish-review-btn")
64
+ .should("be.disabled");
65
+ });
66
+
67
+ it("Shows edit mode buttons", () => {
68
+ cy.dispatchAction("edit", "enableEditMode");
69
+
70
+ cy.get("#document-top-bar-component")
71
+ .find(".right-bar-components")
72
+ .find(".top-bar-buttons")
73
+ .find(".finish-review-button-container")
74
+ .should("not.exist");
75
+
76
+ cy.get("#document-top-bar-component")
77
+ .find(".right-bar-components")
78
+ .find(".top-bar-buttons")
79
+ .find(".edit-mode-buttons")
80
+ .should("be.visible");
81
+ });
82
+
83
+ it("Edits file name", () => {
84
+ const newName = "test-name";
85
+
86
+ cy.get("#document-top-bar-component")
87
+ .find(".center-bar-components")
88
+ .find(".document-name-component")
89
+ .find(".edit-btn")
90
+ .click();
91
+
92
+ cy.get("#document-top-bar-component")
93
+ .find(".center-bar-components")
94
+ .find(".document-name-component")
95
+ .find(".document-name")
96
+ .should("have.class", "is-editable");
97
+
98
+ cy.get("#document-top-bar-component")
99
+ .find(".center-bar-components")
100
+ .find(".document-name-component")
101
+ .find(".document-name")
102
+ .type("{selectAll}")
103
+ .type("{backspace}")
104
+ .type(newName);
105
+
106
+ cy.get("#document-top-bar-component")
107
+ .find(".center-bar-components")
108
+ .find(".document-name-component")
109
+ .find(".save-btn")
110
+ .should("be.visible");
111
+
112
+ cy.get("#document-top-bar-component")
113
+ .find(".center-bar-components")
114
+ .find(".document-name-component")
115
+ .find(".save-btn")
116
+ .click();
117
+
118
+ cy.wait(1000);
119
+
120
+ cy.get("#document-top-bar-component")
121
+ .find(".center-bar-components")
122
+ .find(".document-name-component")
123
+ .find(".cloud-icon")
124
+ .should("be.visible");
125
+
126
+ cy.wait(1000);
127
+
128
+ cy.get("#document-top-bar-component")
129
+ .find(".center-bar-components")
130
+ .find(".document-name-component")
131
+ .contains(newName);
132
+ });
133
+
134
+ it("Shows tooltip when hovering over keyboard info", () => {
135
+ cy.get("#document-top-bar-component")
136
+ .find(".right-bar-components")
137
+ .find(".keyboard-actions-info")
138
+ .trigger("mouseenter");
139
+
140
+ cy.get("#document-top-bar-component")
141
+ .find(".right-bar-components")
142
+ .find(".keyboard-actions-info")
143
+ .find(".keyboard-actions-description")
144
+ .should("be.visible");
145
+
146
+ cy.get("#document-top-bar-component")
147
+ .find(".right-bar-components")
148
+ .find(".keyboard-actions-info")
149
+ .trigger("mouseleave");
150
+ });
151
+
152
+ it("Closes edit mode when clicking 'back to annotation view' button", () => {
153
+ cy.dispatchAction("edit", "enableEditMode");
154
+
155
+ cy.get("#document-top-bar-component")
156
+ .find(".right-bar-components")
157
+ .find(".edit-mode-buttons")
158
+ .should("exist");
159
+
160
+ cy.get("#document-top-bar-component")
161
+ .find(".right-bar-components")
162
+ .find(".edit-mode-buttons")
163
+ .find(".button-cancel")
164
+ .then(($button) => {
165
+ if (!$button.is(":disabled")) {
166
+ cy.wrap($button).click();
167
+
168
+ cy.wait(1000);
169
+
170
+ cy.get("#document-top-bar-component")
171
+ .find(".right-bar-components")
172
+ .find(".edit-mode-buttons")
173
+ .should("not.exist");
174
+ }
175
+ });
176
+ });
177
+
178
+ it("Shows rename and categorize section when clicking 'next' button", () => {
179
+ cy.dispatchAction("edit", "enableEditMode");
180
+
181
+ cy.get("#document-top-bar-component")
182
+ .find(".right-bar-components")
183
+ .find(".edit-mode-buttons")
184
+ .find(".button-next")
185
+ .click();
186
+
187
+ cy.wait(1000);
188
+
189
+ cy.get("#document-top-bar-component")
190
+ .find(".right-bar-components")
191
+ .find(".edit-mode-buttons")
192
+ .find(".submit-btn")
193
+ .should("be.visible");
194
+ });
195
+ });
package/src/components/DocumentTopBar/DocumentTopBar.vue CHANGED
@@ -123,7 +123,7 @@ export default {
123
123
  "recalculatingAnnotations",
124
124
  ]),
125
125
  ...mapState("edit", ["editMode"]),
126
- ...mapState("project", ["documentsInProject"]),
126
+ ...mapState("display", ["showDocumentsNavigation"]),
127
127
  ...mapGetters("document", [
128
128
  "isDocumentReviewed",
129
129
  "isDocumentReadyToBeReviewed",
@@ -131,9 +131,13 @@ export default {
131
131
  ]),
132
132
  },
133
133
  watch: {
134
- documentsInProject(newValue) {
135
- if (newValue && this.selectedDocument) {
136
- this.getPreviousAndNextDocuments();
134
+ loading(newValue) {
135
+ if (!newValue && this.showDocumentsNavigation) {
136
+ this.$store
137
+ .dispatch("project/fetchDocumentListForNavigation")
138
+ .then((results) => {
139
+ this.getPreviousAndNextDocuments(results);
140
+ });
137
141
  }
138
142
  },
139
143
  },
@@ -157,9 +161,7 @@ export default {
157
161
  handleResize() {
158
162
  this.setComponentWidth(this.$refs.documentTopBar.offsetWidth);
159
163
  },
160
- getPreviousAndNextDocuments() {
161
- const filteredDocuments = this.documentsInProject;
162
-
164
+ getPreviousAndNextDocuments(filteredDocuments) {
163
165
  if (!filteredDocuments) return;
164
166
 
165
167
  const found = filteredDocuments.find(
package/src/store/category.js CHANGED
@@ -3,7 +3,6 @@ import myImports from "../api";
3
3
  const HTTP = myImports.HTTP;
4
4
 
5
5
  const state = {
6
- createAvailableListOfDocuments: false,
7
6
  documentsAvailableToReview: [], // filtered by user
8
7
  categories: null,
9
8
  };
@@ -74,10 +73,13 @@ const actions = {
74
73
  let errors = 0;
75
74
  count += 1;
76
75
 
77
- return dispatch("project/fetchDocumentList", parameters).then(() => {
78
- for (let i = 0; i < rootState.project.documentsInProject.length; i++) {
76
+ return dispatch(
77
+ "project/fetchDocumentListWithParameters",
78
+ parameters
79
+ ).then((documents) => {
80
+ for (let i = 0; i < documents.length; i++) {
79
81
  const found = state.documentsAvailableToReview.find(
80
- (doc) => doc.id === rootState.project.documentsInProject[i].id
82
+ (doc) => doc.id === documents[i].id
81
83
  );
82
84
 
83
85
  if (found) {
@@ -85,19 +87,12 @@ const actions = {
85
87
  // we go to the next item
86
88
  continue;
87
89
  } else if (
88
- rootGetters["document/isDocumentReadyToBeReviewed"](
89
- rootState.project.documentsInProject[i]
90
- )
90
+ rootGetters["document/isDocumentReadyToBeReviewed"](documents)
91
91
  ) {
92
92
  // add available doc to the end of the array
93
- commit(
94
- "ADD_AVAILABLE_DOCUMENT",
95
- rootState.project.documentsInProject[i]
96
- );
93
+ commit("ADD_AVAILABLE_DOCUMENT", documents);
97
94
  } else if (
98
- rootGetters["document/documentHadErrorDuringExtraction"](
99
- rootState.project.documentsInProject[i]
100
- )
95
+ rootGetters["document/documentHadErrorDuringExtraction"](documents)
101
96
  ) {
102
97
  dispatch("document/setDocumentError", null, { root: true });
103
98
  // If error, add 1
@@ -115,10 +110,8 @@ const actions = {
115
110
  // And if the difference is due to errors or to docs not ready
116
111
  if (
117
112
  poll &&
118
- rootState.project.documentsInProject.length !==
119
- state.documentsAvailableToReview.length &&
120
- state.documentsAvailableToReview.length + errors !==
121
- rootState.project.documentsInProject.length
113
+ documents.length !== state.documentsAvailableToReview.length &&
114
+ state.documentsAvailableToReview.length + errors !== documents.length
122
115
  ) {
123
116
  if (count >= 10) return true;
124
117
 
@@ -134,9 +127,8 @@ const actions = {
134
127
 
135
128
  // Poll as long as the lengths are different
136
129
  if (
137
- rootState.project.documentsInProject.length === 0 ||
138
- rootState.project.documentsInProject.length !==
139
- state.documentsAvailableToReview.length
130
+ documents.length === 0 ||
131
+ documents.length !== state.documentsAvailableToReview.length
140
132
  ) {
141
133
  let duration;
142
134
  if (count <= 5) {
package/src/store/display.js CHANGED
@@ -28,6 +28,7 @@ const state = {
28
28
  showAnnSetTable: null,
29
29
  showChooseLabelSetModal: null,
30
30
  hideEmptyLabelSets: false,
31
+ showDocumentsNavigation: true,
31
32
  currentSearch: "",
32
33
  searchEnabled: false,
33
34
  searchResults: [],
@@ -298,6 +299,9 @@ const actions = {
298
299
  showAnnSetTable({ commit }, tableSet) {
299
300
  commit("SET_ANN_SET_TABLE", tableSet);
300
301
  },
302
+ showDocumentsNavigation({ commit }, show) {
303
+ commit("SET_SHOW_DOCUMENTS_NAVIGATION", show);
304
+ },
301
305
  showChooseLabelSetModal({ commit }, options) {
302
306
  commit("SET_SHOW_CHOOSE_LABEL_SET_MODAL", options);
303
307
  },
@@ -401,6 +405,10 @@ const mutations = {
401
405
  state.documentActionBar = actionBar;
402
406
  },
403
407
 
408
+ SET_SHOW_DOCUMENTS_NAVIGATION: (state, show) => {
409
+ state.showDocumentsNavigation = show;
410
+ },
411
+
404
412
  SET_ANN_SET_TABLE: (state, tableSet) => {
405
413
  state.showAnnSetTable = tableSet;
406
414
  },
package/src/store/document.js CHANGED
@@ -1147,24 +1147,6 @@ const actions = {
1147
1147
  await dispatch("category/fetchCategories", projectId, {
1148
1148
  root: true,
1149
1149
  });
1150
-
1151
- // get list of documents not reviewed
1152
- await dispatch("project/fetchDocumentList", "is_reviewed=false", {
1153
- root: true,
1154
- });
1155
- }
1156
- if (categoryId && rootState.category.createAvailableListOfDocuments) {
1157
- await dispatch(
1158
- "category/createAvailableDocumentsList",
1159
- {
1160
- categoryId,
1161
- user: rootState.project.currentUser.username,
1162
- poll: false,
1163
- },
1164
- {
1165
- root: true,
1166
- }
1167
- );
1168
1150
  }
1169
1151
  }
1170
1152
  if (isRecalculatingAnnotations) {