ehr-alerts-ui 0.0.14 → 0.0.18

package/package.json

@@ -3,7 +3,7 @@
   "main": "lib/index.cjs.js",
   "module": "lib/index.js",
   "types": "lib/components/index.d.ts",
-  "version": "0.0.14",
+  "version": "0.0.18",
   "dependencies": {
     "@types/node": "^12.0.0",
     "@types/react": "^17.0.0",
@@ -64,7 +64,7 @@
     "start": "react-scripts start",
     "build": "rm -rf lib && rollup -c rollup.config.js",
     "prepack": "npm run build",
-    "build_standalone": "rm -rf build && sed -i \"s~0.0.14~0.0.10~\" ./package.json && react-scripts build"
+    "build_standalone": "rm -rf build && sed -i \"s~0.0.18~0.0.10~\" ./package.json && react-scripts build"
   },
   "eslintConfig": {
     "extends": [

package/src/library/actions/AlertActions.ts

@@ -1,10 +1,11 @@
 import {Action} from "redux";
-import {Alert} from "../reducers/tableReducer";
+import {Alert, Audience} from "../reducers/tableReducer";
 import {ThunkAction} from "redux-thunk";
 import {AlertsUiState} from "../reducers";
 import Axios from "axios";
 import {clearTable, loadAlerts, TableActions} from "./TableActions";
 import {AlertModalError} from "../reducers/alertReducer";
+import appendZero from "../helpers/appendZero";
 
 export enum AlertActionsType {
   CREATE_ALERT = 'CREATE_ALERT',
@@ -88,18 +89,24 @@ export function updateAlert(): ThunkAction<void, AlertsUiState, unknown, AlertAc
     const begin = applyHour(alert.beginHour, applyMinutes(alert.beginMinute, alert.begin));
     const end = applyHour(alert.endHour, applyMinutes(alert.endMinute, alert.end));
 
+    // Lazy convert to local time
+    const beginDate = toLocalString(begin);
+    console.log(beginDate);
+    const endDate = toLocalString(end);
+
+
     Axios({
       method: "put",
       url: (window as any).APP_URL_APP + `/api/yld-teated/v1/api/message/${alert.id}`,
       data: JSON.stringify({
         id: 0,
-        code: alert.audience,
+        code: "",
         title: alert.title,
         body: alert.content,
-        open: true,
+        open: alert.audience === Audience.NOT_AUTHENTICATED,
         level: alert.level,
-        begin: begin.toISOString(),
-        end: end.toISOString()
+        begin: beginDate,
+        end: endDate,
       }),
       headers: {
         'Content-Type': 'Application/JSON',
@@ -120,21 +127,21 @@ export function postAlert(): ThunkAction<void, AlertsUiState, unknown, AlertActi
       return;
     }
 
-    const begin = applyHour(alert.beginHour, applyMinutes(alert.beginMinute, alert.begin));
-    const end = applyHour(alert.endHour, applyMinutes(alert.endMinute, alert.end));
+    const begin = toLocalString(applyHour(alert.beginHour, applyMinutes(alert.beginMinute, alert.begin)));
+    const end = toLocalString(applyHour(alert.endHour, applyMinutes(alert.endMinute, alert.end)));
 
     Axios({
       method: "post",
       url: (window as any).APP_URL_APP + '/api/yld-teated/v1/api/message',
       data: JSON.stringify({
         id: 0,
-        code: alert.audience,
+        code: "",
         title: alert.title,
         body: alert.content,
-        open: true,
+        open: alert.audience === Audience.NOT_AUTHENTICATED,
         level: alert.level,
-        begin: begin.toISOString(),
-        end: end.toISOString()
+        begin: begin,
+        end: end
       }),
       headers: {
         'Content-Type': 'Application/JSON',
@@ -170,4 +177,11 @@ function applyMinutes(value: number | undefined, oldDate: Date | string | undefi
   newDate.setMinutes(minutes);
 
   return newDate;
+}
+
+function toLocalString(date: Date): string {
+  return `${date.getUTCFullYear()}-` +
+          `${appendZero((date.getUTCMonth() + 1).toString())}-` +
+          `${appendZero((date.getDate()).toString())}` +
+          `T${date.toLocaleTimeString()}`;
 }

package/src/library/actions/TableActions.ts

@@ -1,4 +1,4 @@
-import {Alert, MessageLevel} from "../reducers/tableReducer";
+import {Alert, Audience} from "../reducers/tableReducer";
 import {ThunkAction} from "redux-thunk";
 import Axios from 'axios';
 import {AlertsUiState} from "../reducers";
@@ -81,15 +81,15 @@ export function loadAlerts(): ThunkAction<void, AlertsUiState, unknown, TableAct
 
         // Populate table
         for (const alert of alerts) {
-          const begin = new Date(alert.begin+"Z");
-          const end = new Date(alert.end+"Z");
+          const begin = new Date(alert.begin);
+          const end = new Date(alert.end);
 
           dispatch(addAlert({
             id: alert.id,
             title: alert.title,
             content: alert.body,
             level: alert.level,
-            audience: alert.code,
+            audience: (alert.open) ? Audience.NOT_AUTHENTICATED : Audience.AUTHENTICATED,
             begin: printDate(begin, true),
             beginHour: begin.getHours(),
             beginMinute: begin.getMinutes(),

package/src/library/components/AlertModal/AlertModal.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import {Button, DatePicker, FieldWrapper, Input, Section, Select, TextArea, AlertIcon} from 'ehr-components';
-import {Alert, MessageLevel} from "../../reducers/tableReducer";
+import {Alert, Audience, MessageLevel} from "../../reducers/tableReducer";
 import appendZero from "../../helpers/appendZero";
 import {AlertModalError} from "../../reducers/alertReducer";
 
@@ -24,17 +24,22 @@ enum ContentLanguage {
   RU,
 }
 
+const audiences = [
+  {code: Audience.AUTHENTICATED, texts: 'Autenditud kasutaja'},
+  {code: Audience.NOT_AUTHENTICATED, texts: 'Autentimata kasutaja'},
+]
+
 const messageLevels = [
   {code: MessageLevel.TEADE, texts: 'Teade (roheline)'},
-  {code: MessageLevel.HOIATUS, texts: 'Hoiatus'},
-  {code: MessageLevel.VEATEADE, texts: 'Veateade'},
+  {code: MessageLevel.HOIATUS, texts: 'Hoiatus (kollane)'},
+  {code: MessageLevel.VEATEADE, texts: 'Veateade (punane)'},
 ]
 
 const AlertModal: React.FC<AlertModalState & AlertModalDispatch> = ({alert, clearAlert, editAlert, postAlert,
                                                                       updateAlert, addAlertModalError, errors,
                                                                       clearAlertModalErrors}) => {
 
-  function onAudienceChange(code: string) {
+  function onAudienceChange(code: Audience) {
     if (!alert) {
       return;
     }
@@ -311,16 +316,16 @@ const AlertModal: React.FC<AlertModalState & AlertModalDispatch> = ({alert, clea
             <div className='alerts-ui--alert-creation-modal--content'>
 
               <FieldWrapper label='Teate publik'
-                            info={{content: 'Teate publik label'}}
+                            info={{content: 'Autentimata kasutaja on iga kasutaja, kes avab e-ehituse veebilehe. Autenditud kasutaja on kasutaja, kes logib end e-ehituse veebi sisse. Teate loomisel tuleb arvestada, kas teade on vajalik neile, kes on juba lehel sisse loginud või kõikidele, kes lehele satuvad.'}}
                             className={checkSelfError('publik')}
                             component={
-                              <Select name='audience' value={alert.audience} onChange={onAudienceChange} options={[{code: 'Autenditud kasutaja', texts: 'Autenditud kasutaja'}]} />
+                              <Select name='audience' value={alert.audience} onChange={onAudienceChange} options={audiences} />
                             }
                             required
               />
 
               <FieldWrapper label='Teate tase'
-                            info={{content: 'Teate tase label'}}
+                            info={{content: 'Teade (roheline) on neutraalse või positiivse sisuga. Näiteks info uue teenuse või muutuse kohta keskkonnas. Hoiatus (kollane) on hoiatav info millegi kohta, mis võib häirida kasutaja tööd lehel, kuid ei takista. Näiteks suhtlus mõne teise registriga võib olla häiritud. Veateade (punane) on teade selle kohta, et midagi ei tööta ja see takistab tööd lehel. Näiteks teenus on mingi aeg maas, allkirjastamine ei tööta, sisse logida ei saa.'}}
                             className={checkSelfError('tease')}
                             component={
                               <Select name='level' value={alert.level} onChange={onLevelChange} options={messageLevels} />
@@ -329,7 +334,7 @@ const AlertModal: React.FC<AlertModalState & AlertModalDispatch> = ({alert, clea
               />
 
               <FieldWrapper label='Teate kuvamise algus'
-                            info={{content: 'Teate kuvamise algus label'}}
+                            info={{content: 'Teade kuvatakse kasutajale siin märgitud kellaajast alates'}}
                             component={
                               <div className='alerts-ui--alert-creation-modal--content--date'>
                                 <InternalDatePicker date={alert.begin} onChange={onDateStartChange} title='start_date'
@@ -354,7 +359,7 @@ const AlertModal: React.FC<AlertModalState & AlertModalDispatch> = ({alert, clea
               />
 
               <FieldWrapper label='Teate kuvamise lõpp'
-                            info={{content: 'Teate kuvamise lõpp label'}}
+                            info={{content: 'Teate kuvamine kasutajale lõpeb siin märgitud kellaajast'}}
                             component={
                               <div className='alerts-ui--alert-creation-modal--content--date'>
                                 <InternalDatePicker date={alert.end} onChange={onDateEndChange} title='end_date'
@@ -379,71 +384,86 @@ const AlertModal: React.FC<AlertModalState & AlertModalDispatch> = ({alert, clea
                             required
               />
 
-              <Section form={true} title='EE' >
+              {/*<Section form={true} title='EE' >*/}
 
                 <FieldWrapper label='Teate pealkiri'
-                              info={{content: 'Teate pealkiri label'}}
                               className={checkSelfError('title')}
                               component={
                                 <Input name='Title EE' value={alert.title}
                                        onChange={(c: string) => onTitleChange(ContentLanguage.EE, c)}
+                                       maxLength="100"
                                 />
                               }
                               required
                 />
 
                 <FieldWrapper label='Teate sisu'
-                              info={{content: 'Teate sisu label'}}
                               className={checkSelfError('content')}
                               component={
                                 <TextArea name='Content EE' value={alert.content}
                                           onChange={(c: string) => onContentChange(ContentLanguage.EE, c)}
+                                          isLimitingLength={true}
+                                          maxLength={500}
                                 />
                               }
                               required
                 />
 
-              </Section>
-
-              <Section form={true} title='EN' collapsed >
-
-                <FieldWrapper label='Message title'
-                              info={{content: 'Message title label'}}
-                              component={
-                                <Input name='Title EN' onChange={(c: string) => onTitleChange(ContentLanguage.EN, c)} />
-                              }
-                              required
-                />
-
-                <FieldWrapper label='Message title'
-                              info={{content: 'Message title label'}}
-                              component={
-                                <TextArea name='Content EN' onChange={(c: string) => onContentChange(ContentLanguage.EN, c)} />
-                              }
-                              required
-                />
-
-              </Section>
-
-              <Section form={true} title='RU' collapsed >
-
-                <FieldWrapper label='Teate pealkiri'
-                              info={{content: 'Teate pealkiri label'}}
-                              component={
-                                <Input name='Title RU' onChange={(c: string) => onTitleChange(ContentLanguage.RU, c)} />
-                              }
-                              required
-                />
-
-                <FieldWrapper label='Teate sisu'
-                              info={{content: 'Teate sisu label'}}
-                              component={
-                                <TextArea name='Content RU' onChange={(c: string) => onContentChange(ContentLanguage.RU, c)} />
-                              }
-                              required
-                />
-
-              </Section>
+              {/*</Section>*/}
+
+              {/*<Section form={true} title='EN' collapsed >*/}
+
+              {/*  <FieldWrapper label='Message title'*/}
+              {/*                info={{content: 'Message title label'}}*/}
+              {/*                component={*/}
+              {/*                  <Input name='Title EN'*/}
+              {/*                         onChange={(c: string) => onTitleChange(ContentLanguage.EN, c)}*/}
+              {/*                         maxLength="100"*/}
+              {/*                  />*/}
+              {/*                }*/}
+              {/*                required*/}
+              {/*  />*/}
+
+              {/*  <FieldWrapper label='Message title'*/}
+              {/*                info={{content: 'Message title label'}}*/}
+              {/*                component={*/}
+              {/*                  <TextArea name='Content EN'*/}
+              {/*                            onChange={(c: string) => onContentChange(ContentLanguage.EN, c)}*/}
+              {/*                            isLimitingLength={true}*/}
+              {/*                            maxLength={500}*/}
+              {/*                  />*/}
+              {/*                }*/}
+              {/*                required*/}
+              {/*  />*/}
+
+              {/*</Section>*/}
+
+              {/*<Section form={true} title='RU' collapsed >*/}
+
+              {/*  <FieldWrapper label='Teate pealkiri'*/}
+              {/*                info={{content: 'Teate pealkiri label'}}*/}
+              {/*                component={*/}
+              {/*                  <Input name='Title RU'*/}
+              {/*                         onChange={(c: string) => onTitleChange(ContentLanguage.RU, c)}*/}
+              {/*                         maxLength="100"*/}
+              {/*                  />*/}
+              {/*                }*/}
+              {/*                required*/}
+              {/*  />*/}
+
+              {/*  <FieldWrapper label='Teate sisu'*/}
+              {/*                info={{content: 'Teate sisu label'}}*/}
+              {/*                component={*/}
+              {/*                  <TextArea name='Content RU'*/}
+              {/*                            onChange={(c: string) => onContentChange(ContentLanguage.RU, c)}*/}
+              {/*                            isLimitingLength={true}*/}
+              {/*                            maxLength={500}*/}
+              {/*                  />*/}
+              {/*                }*/}
+              {/*                required*/}
+              {/*  />*/}
+
+              {/*</Section>*/}
             </div>
 
             <div className='alerts-ui--alert-creation-modal--footer mt-2'>

package/src/library/components/AlertsTable/AlertsTable.tsx

@@ -1,5 +1,5 @@
 import React, {useEffect, useState} from "react";
-import {Button, CollapseTable, CollapseTableRow, ControlledPopover} from 'ehr-components';
+import {Button, CollapseTable, CollapseTableRow, ControlledPopover, Tooltip} from 'ehr-components';
 import SortableRow from "./SortableRow";
 import {Alert} from "../../reducers/tableReducer";
 import {ReactComponent as CopyIcon} from "../../assets/icons/copy.svg";
@@ -150,12 +150,16 @@ const AlertsTable: React.FC<AlertsTableState & AlertsTableDispatch> = ({alerts,
       alert.level,
       `${alert.begin} - ${alert.end}`,
       alert.content,
-      <button className='alerts-ui--icon-button' onClick={() => duplicateAlert(alert)}>
-        <CopyIcon fill={styles.colorGreyDark} />
-      </button>,
-      <button className='alerts-ui--icon-button' onClick={() => editAlert(alert)}>
-        <EditIcon fill={styles.colorGreyDark} />
-      </button>,
+      <Tooltip content='Kopeerin'>
+        <button className='alerts-ui--icon-button' onClick={() => duplicateAlert(alert)}>
+          <CopyIcon fill={styles.colorGreyDark} />
+        </button>
+      </Tooltip>,
+      <Tooltip content='Muudan'>
+        <button className='alerts-ui--icon-button' onClick={() => editAlert(alert)}>
+          <EditIcon fill={styles.colorGreyDark} />
+        </button>
+      </Tooltip>,
       <ControlledPopover
         className={'popover-confirm'}
         content={deleteContent(alert.id)}
@@ -164,7 +168,11 @@ const AlertsTable: React.FC<AlertsTableState & AlertsTableDispatch> = ({alerts,
         theme={'danger'}
         toggle={() => onToggleDeletePopup(alert)}
       >
-        <button className='alerts-ui--icon-button'><DeleteIcon fill={styles.colorGreyDark} /></button>
+        <div>
+          <Tooltip content='Kustutan'>
+            <button className='alerts-ui--icon-button'><DeleteIcon fill={styles.colorGreyDark} /></button>
+          </Tooltip>
+        </div>
       </ControlledPopover>,
     ];
   }

package/src/library/reducers/alertReducer.ts

@@ -1,5 +1,5 @@
 import {AlertActions, AlertActionsType} from "../actions/AlertActions";
-import {Alert, MessageLevel} from "./tableReducer";
+import {Alert, Audience, MessageLevel} from "./tableReducer";
 
 export interface AlertModalError {
   title: string,
@@ -33,7 +33,7 @@ export function alertReducer(state = initialState, action: AlertActions): AlertS
           endMinute: undefined,
           level: MessageLevel.TEADE,
           title: '',
-          audience: '',
+          audience: Audience.AUTHENTICATED,
         }
       }
     }

package/src/library/reducers/tableReducer.ts

@@ -1,5 +1,9 @@
 import {TableActions, TableActionsType} from "../actions/TableActions";
 
+export enum Audience {
+  AUTHENTICATED = "Autenditud kasutaja",
+  NOT_AUTHENTICATED = "Autentimata kasutaja",
+}
 
 export enum MessageLevel {
   "TEADE" = "TEADE",
@@ -10,7 +14,7 @@ export enum MessageLevel {
 export interface Alert {
   id: number,
   title: string,
-  audience: string,
+  audience: Audience,
   level: MessageLevel,
   begin: string | undefined,
   beginHour: number | undefined,

package/ehr-alerts-ui.iml

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager" inherit-compiler-output="true">
-    <exclude-output />
-    <content url="file://$MODULE_DIR$" />
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>