Feature/updates screen use infinite swr hook (#303)

* Use "RequestManager" for loading updates

* [Cleanup] Fix typing

* Memoize grouped updates

* [TSConfig] Increase target version

Makes it possible to iterate over a "IterableIterator" (e.g. [...<Map>.entries()])

* Use "GroupedVirtuoso" for "Updates" screen

* Optionally use "padding" instead of margin for the loading placeholder

In case the loading placeholder gets used in a "react-virtuoso" list, the margin might cause issues with the calculated height.

* Use "padding" instead of "margin"

"Margin" breaks "react-virtuosos" height calculation

* Add background color to group header

With virtuoso the group headers are sticky, thus, a background color is needed

* Simplify "groupByDate" object structure

It's not necessary to save the items inside the group object

src/components/util/LoadingPlaceholder.tsx

@@ -15,10 +15,11 @@ interface IProps {
     children?: React.ReactNode;
     component?: string | React.FunctionComponent<any> | React.ComponentClass<any, any>;
     componentProps?: any;
+    usePadding?: boolean;
 }
 
 export default function LoadingPlaceholder(props: IProps) {
-    const { children, shouldRender, component, componentProps } = props;
+    const { children, shouldRender, component, componentProps, usePadding } = props;
 
     let condition = true;
     if (shouldRender !== undefined) {
@@ -38,7 +39,10 @@ export default function LoadingPlaceholder(props: IProps) {
     return (
         <Box
             sx={{
-                margin: '10px auto',
+                margin: '0px auto',
+                marginTop: usePadding ? 'unset' : '10px',
+                marginBottom: usePadding ? 'unset' : '10px',
+                padding: usePadding ? '10px 0' : 'unset',
                 display: 'flex',
                 justifyContent: 'center',
             }}