event cucle (#76)

* install sass
* refact: integration settings
- OSC in its own HTTP endpoint
- OSC settings have own object in db
* refact: simplify event cycle
* refact: restructure external triggers http
* refact: restructure external triggers osc+socket
* refact: restructure data updates
* feat: osc integration class
* IO improvements
- timer uses osc integration
- create trigger handler to manage external triggers
* refact: refract state machine update
* Integration: simple HTTP Client
* Integration: http options in datamodel
* Integration: call http send on life cycle
* feat/62-logging: fix issue #71

client/src/features/modals/AliasesModal.jsx

@@ -1,4 +1,4 @@
-import { IconButton } from '@chakra-ui/button';
+import { Button, IconButton } from '@chakra-ui/button';
 import { FiPlus, FiMinus } from 'react-icons/fi';
 import { ModalBody } from '@chakra-ui/modal';
 import { Input } from '@chakra-ui/react';
@@ -6,7 +6,7 @@ import { fetchEvent } from 'app/api/eventApi';
 import { useState } from 'react';
 import { useFetch } from 'app/hooks/useFetch';
 import { EVENT_TABLE } from 'app/api/apiConstants';
-import style from './Modals.module.css';
+import style from './Modals.module.scss';
 
 export default function AliasesModal() {
   const { data, status, isError } = useFetch(EVENT_TABLE, fetchEvent);
@@ -31,10 +31,10 @@ export default function AliasesModal() {
           <p className={style.notes}>
             Configure easy to use URL Aliases
             <br />
-            !!! Feature is not yet implemented !!!
+            ❄️ Feature is not yet implemented ❄️
           </p>
 
-          <span> Default URLs </span>
+          <span>Default URLs</span>
 
           <div className={style.highNotes}>
             <p className={style.flexNote}>
@@ -83,7 +83,7 @@ export default function AliasesModal() {
             </p>
           </div>
 
-          <span> Manage custom aliases</span>
+          <span>Manage custom aliases</span>
           <div className={style.modalInline}>
             <Input
               size='sm'
@@ -145,6 +145,16 @@ export default function AliasesModal() {
               disabled
             />
           </div>
+          <div className={style.submitContainer}>
+            <Button
+              colorScheme='blue'
+              type='submit'
+              isLoading={submitting}
+              disabled={true}
+            >
+              Save
+            </Button>
+          </div>
         </ModalBody>
       </form>
     </>