Record recognition SPARQL option added.

Author: marek-kozlovsky-ata

src/components/SFormsDisplay.js

@@ -57,11 +57,16 @@ export class SFormsDisplay extends React.Component {
         }
     }
 
-
-    fetchTypeAheadValues = (query) => {
-        const possibleValues = require('../__mocks__/possibleValues.json');
-        return new Promise((resolve) => setTimeout(() => resolve(possibleValues), 1500));
-    };
+    fetchTypeAheadValues = async (query) => {
+        return await API.post("/rest/sforms/s-forms-possible-values", null, {
+            params: {
+                "query": query
+            }
+        }).then(response => {
+            console.log(response.data)
+            return response;
+        });
+    }
 
     render() {
         if (!this.props.contextUri && (!this.props.version1 || !this.props.version2)) {
@@ -87,6 +92,8 @@ export class SFormsDisplay extends React.Component {
             },
             modalView: false,
             modalProps,
+            wizardStepButtons: true,
+            enableForwardSkip: true,
             horizontalWizardNav: true
         };
         if ((this.props.contextUri && this.state.rawJsonForm) || (this.props.version1 && this.props.version2 && this.state.rawJsonForm)) {
@@ -96,7 +103,6 @@ export class SFormsDisplay extends React.Component {
                 options={options}
                 fetchTypeAheadValues={this.fetchTypeAheadValues}
                 isFormValid={(isFormValid) => this.setState({isFormValid})}
-                enableForwardSkip={true}
             />;
         } else {
             return <Alert variant={"light"} className={"h-10"}>

src/components/form/ProjectStatistics.js

@@ -210,7 +210,8 @@ export class ProjectStatistics extends React.Component {
                         <OverlayTrigger
                             placement="bottom"
                             overlay={<Tooltip id="button-tooltip-2">
-                                Record snapshots that are associated with at least some questions (user has seen the form).
+                                Record snapshots that are associated with at least some questions (user has seen the
+                                form).
                             </Tooltip>}>
                             <FontAwesomeIcon color="grey" icon={faQuestionCircle}/>
                         </OverlayTrigger>

src/components/form/RecordSnapshotLine.js

@@ -20,7 +20,9 @@ export class RecordSnapshotLine extends React.Component {
                 <ListGroup.Item>
                     <Row>
                         <Col xs={9}>
-                            <span>FormTemplateVersion: <b>{this.props?.formTemplateVersionKey || "none"}</b> {this.props.formTemplateVersionInternalName ? "(" + this.props.formTemplateVersionInternalName + ")" : ""}</span>
+                            <span>RecordVersion: <b>{this.props.recordVersionKey}</b></span>
+                            <br/>
+                            <span>FormTemplateVersion: {this.props?.formTemplateVersionKey || "none"} {this.props.formTemplateVersionInternalName ? "(" + this.props.formTemplateVersionInternalName + ")" : ""}</span>
                             <br/>
                             <span>Snapshot created:{' '}
                                 <Moment format="DD.MM.YYYY hh:mm:ss">
@@ -45,7 +47,7 @@ export class RecordSnapshotLine extends React.Component {
                                 <Button
                                     variant="outline-primary" size="sm" className="float-right"
                                     onClick={() => this.props.compareRecordSnapshotsFunction(this.props.order)}>
-                                    Compare to previous version
+                                    Compare to previous snapshot
                                 </Button>
                             }
                         </Col>

src/components/form/RecordSnapshotList.js

@@ -41,7 +41,7 @@ export class RecordSnapshotList extends React.Component {
         // alert("as a second snapshot, hardcoded value (sm498150982) is used due to lack of usable examples");
 
         const recordSnapshotContextUri1 = this.state.recordSnapshots[recordSnapshotIndex].internalKey;
-        const recordSnapshotContextUri2 =  this.state.recordSnapshots[recordSnapshotIndex - 1].internalKey; // TODO: when there's records with actual history
+        const recordSnapshotContextUri2 = this.state.recordSnapshots[recordSnapshotIndex - 1].internalKey; // TODO: when there's records with actual history
         // const recordSnapshotContextUri2 = "sm498150982"
         this.props.displayComparedAnswersFunction(recordSnapshotContextUri1, recordSnapshotContextUri2)
     }
@@ -60,6 +60,7 @@ export class RecordSnapshotList extends React.Component {
                                        internalKey={recordSnapshot.internalKey}
                                        formTemplateVersionKey={recordSnapshot.formTemplateVersionKey}
                                        formTemplateVersionInternalName={recordSnapshot.formTemplateVersionInternalName}
+                                       recordVersionKey={recordSnapshot.recordVersionKey}
                                        recordSnapshotCreated={recordSnapshot.recordSnapshotCreated}
                                        remoteSampleContextURI={recordSnapshot.remoteSampleContextURI}
                                        numberOfAnswers={recordSnapshot.numberOfAnswers}

src/components/formtemplate/FormTemplateVersionLine.js

@@ -54,7 +54,7 @@ export class FormTemplateVersionLine extends React.Component {
                             {internalNameDiv}
                             <span>Internal version key: <b>{this.props.internalKey}</b></span>
                             <br/>
-                            <span>Number of instances: <b>{"todo"}</b></span>
+                            <span>Number of instances: <b>{this.props.numberOfRecordSnapshots}</b></span>
                             <br/>
                         </Col>
                         <Col xs={3}>

src/components/formtemplate/FormTemplateVersionList.js

@@ -48,6 +48,7 @@ export class FormTemplateVersionList extends React.Component {
                                             numberOfQuestionTemplateSnapshots={version.numberOfQuestionTemplateSnapshots}
                                             projectName={this.props.projectName}
                                             internalKey={version.key}
+                                            numberOfRecordSnapshots={version.numberOfRecordSnapshots}
                                             clickHandler={this.props.updateActiveContextUri}/>;
         }) : <Alert variant={"light"} className={"h-10"}>
             The list is empty.

src/components/projects/AddProjectForm.js

@@ -26,6 +26,7 @@ class AddProjectForm extends React.Component {
             formGenRepositoryUrl: '',
             serviceUrl: '',
             appRepositoryUrl: '',
+            recordRecognitionSPARQL: '',
             showSuccess: false,
             showError: false
         }
@@ -45,7 +46,8 @@ class AddProjectForm extends React.Component {
             projectName: this.state.projectName,
             formGenRepositoryUrl: this.state.formGenRepositoryUrl,
             formGenServiceUrl: this.state.serviceUrl,
-            appRepositoryUrl: this.state.appRepositoryUrl
+            appRepositoryUrl: this.state.appRepositoryUrl,
+            recordRecognitionSPARQL: this.state.recordRecognitionSPARQL
         }).then(() => {
             this.props.addProject(this.state.projectName)
             this.messageForm.reset();
@@ -91,6 +93,13 @@ class AddProjectForm extends React.Component {
                         <Form.Control type="text" placeholder="App Repository URL" name="appRepositoryUrl"
                                       onChange={this.onChangeSetState}/>
                     </Form.Group>
+                    <Form.Group controlId="formBasicAppRecordRecognitionSPARQL">
+                        <Form.Label>Record recognition SPARQL</Form.Label>
+                        <Form.Control as="textarea"
+                                      placeholder="SELECT ?recordCreateDate ?recordModifiedDate ?remoteRecordURI ?question"
+                                      name="recordRecognitionSPARQL" rows={5}
+                                      onChange={this.onChangeSetState}/>
+                    </Form.Group>
                     <Button variant="primary" type="submit">
                         Submit
                     </Button>

src/components/projects/ProjectsOverview.js

@@ -49,8 +49,8 @@ export class ProjectsOverview extends React.Component {
         if (this.state.isLoading) {
             projectLines = <div>Loading...</div>
         } else {
-            projectLines = this.state.projects.map(app => {
-                const {formGenRepositoryUrl, formGenServiceUrl, appRepositoryUrl, projectName: projectName} = app;
+            projectLines = this.state.projects.map(project => {
+                const {formGenRepositoryUrl, formGenServiceUrl, appRepositoryUrl, projectName: projectName, recordRecognitionSPARQL: recordRecognitionSPARQL} = project;
 
                 return <div key={projectName}>
                     <Card>
@@ -79,6 +79,12 @@ export class ProjectsOverview extends React.Component {
                                     <Col>{appRepositoryUrl}</Col>
                                 </Row>
                             </ListGroup.Item>
+                            <ListGroup.Item>
+                                <Row>
+                                    <Col xs={3}><p className="font-weight-bold"> Record recognition SPARQL </p></Col>
+                                    <Col>{recordRecognitionSPARQL}</Col>
+                                </Row>
+                            </ListGroup.Item>
                             <ListGroup.Item>
                                 <Row>
                                     <Col>

src/components/search/SearchOptionsPicker.js

@@ -6,7 +6,7 @@ import ListGroup from "react-bootstrap/ListGroup";
 import Col from "react-bootstrap/Col";
 import Form from "react-bootstrap/Form";
 import {ExtensibleAutocompleteFields} from "./ExtensibleAutocompleteFields";
-import {DagDemo, TreeDemo} from "./AutocompleteTextField";
+import {DagDemo} from "./AutocompleteTextField";
 
 
 export class SearchOptionsPicker extends React.Component {