Added loader component for Gitops page (#4192)

* Added loader component for gitops page

Signed-off-by: Saranya-jena <[email protected]>

* updated readme

Signed-off-by: Saranya-jena <[email protected]>

---------

Signed-off-by: Saranya-jena <[email protected]>

Author: Saranya-jena

chaoscenter/README.md

@@ -1,4 +1,6 @@
-## Installation steps for Litmus 3.0.0-beta9
+# [LitmusChaos 3.0.0](https://docs.litmuschaos.io/)
+
+## Installation steps for Litmus 3.0.0
 
 ### Mongo installation via Helm - Bitnami Mongo
 

chaoscenter/web/src/controllers/Gitops/Gitops.tsx

@@ -4,6 +4,7 @@ import GitopsView from '@views/Gitops/Gitops';
 import { enableGitOps, getGitOpsDetails, updateGitOps } from '@api/core/gitops';
 import { getScope } from '@utils';
 import { disableGitOps } from '@api/core/gitops/disableGitops';
+import Loader from '@components/Loader';
 
 export default function GitopsController(): React.ReactElement {
   const scope = getScope();
@@ -44,17 +45,25 @@ export default function GitopsController(): React.ReactElement {
     onError: err => showError(err.message)
   });
   return (
-    <GitopsView
-      gitopsDetails={getGitOpsDetailsData?.getGitOpsDetails}
-      enableGitops={enableGitopsMutation}
-      disableGitops={disableGitopsMutation}
-      updateGitops={updateGitopsMutation}
-      loading={{
-        getGitOpsDetailsLoading: getGitOpsDetailsLoading,
-        disableGitopsMutationLoading: disableGitopsMutationLoading,
-        updateGitopsMutationLoading: updateGitopsMutationLoading,
-        enableGitopsMutationLoading: enableGitopsMutationLoading
+    <Loader
+      loading={getGitOpsDetailsLoading}
+      height="fit-content"
+      style={{
+        minHeight: getGitOpsDetailsLoading ? 'calc(var(--page-min-height) - var(--spacing-xxlarge))' : 'initial'
       }}
-    />
+    >
+      <GitopsView
+        gitopsDetails={getGitOpsDetailsData?.getGitOpsDetails}
+        enableGitops={enableGitopsMutation}
+        disableGitops={disableGitopsMutation}
+        updateGitops={updateGitopsMutation}
+        loading={{
+          getGitOpsDetailsLoading: getGitOpsDetailsLoading,
+          disableGitopsMutationLoading: disableGitopsMutationLoading,
+          updateGitopsMutationLoading: updateGitopsMutationLoading,
+          enableGitopsMutationLoading: enableGitopsMutationLoading
+        }}
+      />
+    </Loader>
   );
 }

chaoscenter/web/src/controllers/InviteNewMembers/helper.ts

@@ -6,7 +6,7 @@ export function generateInviteUsersTableContent(userData: Array<User> | undefine
     userData && userData.length > 0
       ? userData.map(user => {
           return {
-            id: user.userID,
+            userID: user.userID,
             username: user.username,
             email: user.email ?? '',
             name: user.name ?? ''

images/litmus-control-and-execution-plane-overview.png

@@ -1,5 +1,7 @@
 ## **ChaosCenter**
 
+[Deprecated with the release of Litmus 3.0.0. Visit [here](https://github.com/litmuschaos/litmus/tree/master/chaoscenter) for installation guide.]
+
 ChaosCenter provides console and UI experience for managing, monitoring, and events around chaos workflows. Chaos workflows consist of a sequence of experiments run together to achieve the objective of introducing some kind of fault into an application or the Kubernetes platform.
 
 ## **Platforms Support**
@@ -70,7 +72,6 @@ kubectl apply -f https://raw.githubusercontent.com/litmuschaos/litmus/master/lit
 
 - All environment variables.
 
-
 #### Retrieving external url to access the litmus portal
 
 ##### GKE/Okteto Cloud/EKS
@@ -97,6 +98,7 @@ ChaosCenter provides console or UI experience for managing, monitoring, and even
 View the User Guide <b>[here](https://docs.litmuschaos.io/)</b>
 
 ### **Local Development Guide for ChaosCenter**
+
 Local Development Guide for ChaosCenter can be found <b>[here](https://github.com/litmuschaos/litmus/wiki/ChaosCenter-Development-Guide)</b>
 
 ### **Upgrade from 3.0.0-beta7 to 3.0.0-beta8**