From f2362a6bd100317c68adb1858bd9552b1e3e8b79 Mon Sep 17 00:00:00 2001
From: Lukas Hirt <lukashirt@mail.com>
Date: Mon, 19 Oct 2020 10:28:24 +0200
Subject: [PATCH] Turn loading component into FC

---
 konnectd/ui/src/components/Loading.js | 74 +++++++++++++--------------
 1 file changed, 36 insertions(+), 38 deletions(-)

diff --git a/konnectd/ui/src/components/Loading.js b/konnectd/ui/src/components/Loading.js
index 65547a694..7dc4ef23a 100644
--- a/konnectd/ui/src/components/Loading.js
+++ b/konnectd/ui/src/components/Loading.js
@@ -32,46 +32,44 @@ const styles = theme => ({
   }
 });
 
-class Loading extends React.PureComponent {
-  render() {
-    const { classes, error } = this.props;
+function retry(event, dispatch) {
+  event.preventDefault();
 
-    return (
-      <Grid container direction="column" alignItems="center" justify="center" spacing={0} className={classes.root}>
-        <Grid item align="center">
-          {renderIf(error === null)(() => (
-            <LinearProgress className={classes.progress} />
-          ))}
-          {renderIf(error !== null)(() => (
-            <div>
-              <Typography variant="h5" gutterBottom align="center">
-                <FormattedMessage id="konnect.loading.error.headline" defaultMessage="Failed to connect to server">
-                </FormattedMessage>
-              </Typography>
-              <Typography  gutterBottom align="center" color="error">
-                <ErrorMessage error={error}></ErrorMessage>
-              </Typography>
-              <Button
-                autoFocus
-                color="primary"
-                variant="outlined"
-                className={classes.button}
-                onClick={(event) => this.retry(event)}
-              >
-                <FormattedMessage id="konnect.login.retryButton.label" defaultMessage="Retry"></FormattedMessage>
-              </Button>
-            </div>
-          ))}
-        </Grid>
+  dispatch(retryHello());
+}
+
+function Loading(props) {
+  const { classes, error } = props;
+
+  return (
+    <Grid container direction="column" alignItems="center" justify="center" spacing={0} className={classes.root}>
+      <Grid item align="center">
+        {renderIf(error === null)(() => (
+          <LinearProgress className={classes.progress} />
+        ))}
+        {renderIf(error !== null)(() => (
+          <div>
+            <Typography variant="h5" gutterBottom align="center">
+              <FormattedMessage id="konnect.loading.error.headline" defaultMessage="Failed to connect to server">
+              </FormattedMessage>
+            </Typography>
+            <Typography  gutterBottom align="center" color="error">
+              <ErrorMessage error={error}></ErrorMessage>
+            </Typography>
+            <Button
+              autoFocus
+              color="primary"
+              variant="outlined"
+              className={classes.button}
+              onClick={(event) => retry(event, props.dispatch)}
+            >
+              <FormattedMessage id="konnect.login.retryButton.label" defaultMessage="Retry"></FormattedMessage>
+            </Button>
+          </div>
+        ))}
       </Grid>
-    );
-  }
-
-  retry(event) {
-    event.preventDefault();
-
-    this.props.dispatch(retryHello());
-  }
+    </Grid>
+  );
 }
 
 Loading.propTypes = {