• Define Validation rules for form elements.
• Style invalid form elements.
• Implement Error/Invalid message texts as i18n Module
• Style mandatory fields
  This issue can be done after #18 and #25 are merged and closed.

Create stories for Message (confirm) boxes and related variants.

• It's also required to have a clean documentation for this component.
• Describe how to create additional message boxes
• Describe all related current action types

Users should have an option to decide increment steps (every 15 min, every 30min etc) .
Additionally, should this apply from the star immediately or for a completed full period.

Confirm dialog can be extended from Message component, which can accept component to render instead of text in Message component.

• Consider to let Message component to accept react component too.(?)

Try to implement yarn add react-big-calendar from https://github.com/intljusticemission/react-big-calendar

To edit content, use a full screen layer component.

• It should be a wrapper component, similar to dialog/msgbox but covers most of the page
• It should have title and an optional close button

App has primary and secondary views, currently home(timer) is primary(dark) and all other views are secondary (light) . This should be kept but should be set using store instead of hard coding.

Component implemented as Autocomplete in __ui folder and placed in top nav.
This component should be extended so, users can find followings (must be everything searchable , extend following points if necessary) one central space :

• Contacts (any info like part of name, surname, mail, etc)
• Worklogs (part of name, description, owners name etc)
• Material (part of name, description, etc)
• add others here if implemented, create issue if not.

Icons from materialUI should be included & bundled into project so icons can also be rendered properly in offline mode.

Instead of complex calendar page, a simplified work logs sorted mainly in date/time but also other sorting options (by customer, isOpen, etc) page may be more useful.

Create button as component with following states/types:

• Default Button
• Cancel button
• Submit button
• Pressed State Animation
  Keep in mind that :
• more states or types can be required in the future.
• Buttons should also be customisable for more themes in the future

At the time that timer stopped, user can assign this time log to existing Work or in a new Work.
Possible solutions:

• A Popup: show a modal dialog box user can choose a existing Work or customer from a drop down list or create a new one
• Switch view to Calendar: Show created work on the calendar view , where user can assign this time log to a Work or a create new one

Creating a work log that completed on the next day (without a pause) is not possible on the Create Worklog interface. But using counter (start/stop) may result a job completed on the next day.
In such case, create one work(time) log for each day.

ex: 23:30 - 00:30 should create 23:30 - 00:00 and 00:00 - 00:30 work time logs .

Each contact can have Worklogs which are saved in relational to contactID in the DB-table.

• Old version of array in contact object should be removed.
• use getWorkLogsOfContact presetQuery to get all worklogs for a contact.

• Implement Styled Components in project
• Use Styled Components in <Timer /> Component

Design MultiInput component should have add[+], remove[x] functionality.

• Attention: Add/Remove will be saved in database only on form save

Add disable state to contact buttons, if a mail, mobile or phone number is missing
is:
should:

All Contacts in development environment are fake. To be implemented is to decide SAVE button with following requirements:

• Save after validate
• Style invalid fields with a simple visual effect (red border). This will be extended in issue [#25 ]
• Save button should be always active if validation fails, shows a pop-up with more information. Content of this pop-up will be implemented with in [#25 ]

On async events, disable user interaction with a spinner/loading layer as component to use globally.

Design visual layout for browser and app modes according to requirements from #30

Currently EventsCalendar is just included in project with minimal style customisations.
This is not an implementation Issue but design issue to define requirements for a better UX.
Create enhancement issues for implementation.

Basic functionality of Suggestion Component is already done. But it should have following functionality too:

• Suggestion types should be array so it can query to multi tables in same time
• Suggestion types should accept any available data table

Message Box - Confirm Box has fixed height, high content may not fit in the dialog view and seems cut out.

• Extend Message box should have optional footer element which may contain buttons.
• Remove Max-height optionally

Create custom components for checkbox and radio elements.

When trying to run the app with npm start on a fresh pull it fails because of a webpack version conflict depicted below.

The issue is caused by the react-scripts version being fixed to 3.2.0.

Setting it to ^3.3.1 fixed the issue for me.

BR
Zvonimir :)

Some information about a contact is saved as Array. For example, email, mobile etc. If a data type of a contact is Array, each item in array should be rendered accordingly.

• Keep in mind that, empty items should not be saved (form validation)
• Each item should have Add/Remove option

Related Component: __ui/input

Implement using: https://www.npmjs.com/package/libphonenumber-js

Use an appropriate i18n library.

Current Navigation contains back/forward - add/edit/remove buttons and search-everywhere component.
In small devices (iPhone5 Portrait- 320x568px) only one A/E/R button can be placed. It's required to have a Navigation concept which offers possibility to have unlimited number of buttons and Nav related components can be included. Navigation concept should :

• Define which functions should be available for each view: Mobile Views contains one component at a time. But for bigger screens, more components can be shown in a single view. In that case more functions and buttons should be included in navigation.
• At each view users should find any relevant functionality with minimum navigation steps without changing to another view.
• Search-everywhere component may(?) be used as navigation helper.

In Top navigation (toolbar) only back/forward and Search-everywhere component will be placed. Therefore:

• Move Toolbar icons with its store logic into views
• Add View name into toolbar as Title for the current view

WorkLogs are visible at Contact details. Consider current design and document requirements for implementation. Create Enhancement issues accordingly

App currently doesn't have an official Name and Logo.

Calendar view should have at least following functionalities:

• In calendar view user can:
  • see all recorded work logs at correct date/time slot.
  • add/edit/remove work logs in calendar
  • Drag/Drop recorded work logs

AppLogo will be shown on devices HomeScreen, desktop etc. So after issue #26

• make all related icon sizes
• Publish them in assets
• Define in manifest.json and in index.html

Current implementation is limited to mobile devices (viewports) according to Mobile First approach. In this ticket is to define all possible use cases.

• Craftsmen should only use App mode (Mobile & Tablet) to save and keep track of their own work in live mode
• Backoffice should only use browser mode (Desktop) with customised layout.

Define App and Browser requirements to help visual design #31 .