From 49d3a04cf4c1b4b031ba6649d9820da7a00ca10b Mon Sep 17 00:00:00 2001
From: Jannis Mattheis <contact@jmattheis.de>
Date: Sat, 7 Dec 2019 12:53:08 +0100
Subject: [PATCH] Fix range bug

---
 ui/src/timespan/TimeSpan.tsx              | 19 +++++++++++++------
 ui/src/timespan/calendar/CalendarPage.tsx |  6 ++++++
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/ui/src/timespan/TimeSpan.tsx b/ui/src/timespan/TimeSpan.tsx
index 2f00029..92b5164 100644
--- a/ui/src/timespan/TimeSpan.tsx
+++ b/ui/src/timespan/TimeSpan.tsx
@@ -33,6 +33,7 @@ export interface TimeSpanProps {
     range: Range & {oldFrom?: moment.Moment};
     initialTags: TagSelectorEntry[];
     dateSelectorOpen?: React.Dispatch<React.SetStateAction<boolean>>;
+    rangeChange?: (r: Range) => void;
     deleted?: () => void;
     stopped?: () => void;
     continued?: () => void;
@@ -46,6 +47,7 @@ export const TimeSpan: React.FC<TimeSpanProps> = React.memo(
         id,
         initialTags,
         dateSelectorOpen = () => {},
+        rangeChange = () => {},
         deleted = () => {},
         stopped = () => {},
         continued = () => {},
@@ -103,13 +105,18 @@ export const TimeSpan: React.FC<TimeSpanProps> = React.memo(
                 }
             },
         });
-
         const wasMoved = !isSameDate(from, oldFrom);
         const showDate = to !== undefined && (!isSameDate(from, to) || wasMoved);
         return (
             <Paper
                 elevation={elevation}
-                style={{display: 'flex', alignItems: 'center', padding: '10px', margin: '10px 0', opacity: wasMoved ? 0.5 : 1}}>
+                style={{
+                    display: 'flex',
+                    alignItems: 'center',
+                    padding: '10px',
+                    margin: '10px 0',
+                    opacity: wasMoved ? 0.5 : 1,
+                }}>
                 <div style={{flex: '1', marginRight: 10}}>
                     <TagSelector
                         dialogOpen={dateSelectorOpen}
@@ -145,7 +152,7 @@ export const TimeSpan: React.FC<TimeSpanProps> = React.memo(
                                     end: inUserTz(newTo).format(),
                                     tags: toInputTags(selectedEntries),
                                 },
-                            });
+                            }).then(() => rangeChange({from: newFrom, to: newTo}));
                         } else {
                             updateTimeSpan({
                                 variables: {
@@ -155,7 +162,7 @@ export const TimeSpan: React.FC<TimeSpanProps> = React.memo(
                                     end: to && inUserTz(to).format(),
                                     tags: toInputTags(selectedEntries),
                                 },
-                            });
+                            }).then(() => rangeChange({from: newFrom, to}));
                         }
                     }}
                     showDate={showDate}
@@ -179,7 +186,7 @@ export const TimeSpan: React.FC<TimeSpanProps> = React.memo(
                                         end: inUserTz(newTo).format(),
                                         tags: toInputTags(selectedEntries),
                                     },
-                                });
+                                }).then(() => rangeChange({from: newFrom, to: newTo}));
                             } else {
                                 updateTimeSpan({
                                     variables: {
@@ -189,7 +196,7 @@ export const TimeSpan: React.FC<TimeSpanProps> = React.memo(
                                         end: inUserTz(newTo).format(),
                                         tags: toInputTags(selectedEntries),
                                     },
-                                });
+                                }).then(() => rangeChange({from, to: newTo}));
                             }
                         }}
                         showDate={showDate}
diff --git a/ui/src/timespan/calendar/CalendarPage.tsx b/ui/src/timespan/calendar/CalendarPage.tsx
index fcd9340..7e8a5ad 100644
--- a/ui/src/timespan/calendar/CalendarPage.tsx
+++ b/ui/src/timespan/calendar/CalendarPage.tsx
@@ -278,6 +278,12 @@ export const CalendarPage: React.FC = () => {
                                 elevation={10}
                                 id={selected.data!.id}
                                 key={selected.data!.id}
+                                rangeChange={(range) => {
+                                    setSelected({
+                                        ...selected,
+                                        data: {...selected.data!, start: range.from.format(), end: range.to && range.to.format()},
+                                    });
+                                }}
                                 deleted={() => {
                                     removeFromTimeSpanInRangeCache(apollo.cache, selected.data!.id, timeSpansResult.variables);
                                     setSelected({selected: null, data: null});