From 57058c97b15f4024a464d8cae7936bb773a8e90f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Th=C3=A9o=20LUDWIG?= <contact@theoludwig.fr>
Date: Sun, 24 Mar 2024 23:51:29 +0100
Subject: [PATCH] feat: add loading state while retrieving habits

---
 app/application/habits/index.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/app/application/habits/index.tsx b/app/application/habits/index.tsx
index 46a36e9..2623222 100644
--- a/app/application/habits/index.tsx
+++ b/app/application/habits/index.tsx
@@ -1,10 +1,11 @@
 import { SafeAreaView } from "react-native-safe-area-context"
+import { ActivityIndicator } from "react-native-paper"
 
 import { HabitsHistory } from "@/presentation/react/components/HabitsHistory/HabitsHistory"
 import { useHabitsTracker } from "@/presentation/react/contexts/HabitsTracker"
 
 const HabitsPage: React.FC = () => {
-  const { habitsTracker } = useHabitsTracker()
+  const { habitsTracker, retrieveHabitsTracker } = useHabitsTracker()
 
   return (
     <SafeAreaView
@@ -12,10 +13,16 @@ const HabitsPage: React.FC = () => {
         {
           flex: 1,
           alignItems: "center",
+          justifyContent:
+            retrieveHabitsTracker.state === "loading" ? "center" : "flex-start",
         },
       ]}
     >
-      <HabitsHistory habitsHistory={habitsTracker.habitsHistory} />
+      {retrieveHabitsTracker.state === "loading" ? (
+        <ActivityIndicator animating size="large" />
+      ) : (
+        <HabitsHistory habitsHistory={habitsTracker.habitsHistory} />
+      )}
     </SafeAreaView>
   )
 }