Feat/new match (#140)

* new match * tests ok * fix app
oxymore-tech · Oct 3, 2024 · a26c543 · a26c543
1 parent 89418d9
commit a26c543
Show file tree

Hide file tree

Showing 75 changed files with 1,201 additions and 1,911 deletions.
diff --git a/app/src/components/communities/DetachedLianeItem.tsx b/app/src/components/communities/DetachedLianeItem.tsx
@@ -0,0 +1,61 @@
+import { Detached, ResolvedLianeRequest } from "@liane/common";
+import { AppText } from "@/components/base/AppText.tsx";
+import { AppColors } from "@/theme/colors.ts";
+import { Pressable, StyleSheet, View } from "react-native";
+import { Row } from "@/components/base/AppLayout.tsx";
+import { AppIcon } from "@/components/base/AppIcon.tsx";
+import React from "react";
+import { useAppNavigation } from "@/components/context/routing.ts";
+
+export type DetachedLianeItemProps = {
+  lianeRequest: ResolvedLianeRequest;
+  state: Detached;
+};
+
+export const DetachedLianeItem = ({ lianeRequest, state }: DetachedLianeItemProps) => {
+  const { navigation } = useAppNavigation();
+
+  if (state.matches.length === 0) {
+    return (
+      <AppText style={{ fontSize: 14, fontWeight: "bold", lineHeight: 23, color: AppColors.orange }}>
+        Cette liane est en attente de conducteur
+      </AppText>
+    );
+  }
+
+  return (
+    <Pressable
+      style={{ flexDirection: "row", justifyContent: "space-between", alignItems: "center", flex: 1, paddingVertical: 5 }}
+      onPress={() => navigation.navigate("ListGroups", { groups: state.matches, lianeRequest })}>
+      <Row>
+        <View style={styles.notificationDotContainer}>
+          <View style={styles.notificationDot} />
+        </View>
+        <AppText
+          style={{
+            fontSize: 14,
+            fontWeight: "bold",
+            lineHeight: 23,
+            color: AppColors.orange,
+            marginLeft: 5
+          }}>
+          {state.matches.length === 1 ? "Voir la liane disponible" : `Voir les ${state.matches.length} lianes disponibles`}
+        </AppText>
+      </Row>
+      <AppIcon name={"arrow-right"} />
+    </Pressable>
+  );
+};
+
+const styles = StyleSheet.create({
+  notificationDotContainer: {
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  notificationDot: {
+    width: 8,
+    height: 8,
+    borderRadius: 6,
+    backgroundColor: AppColors.orange
+  }
+});
diff --git a/app/src/components/communities/JoinedLianeView.tsx b/app/src/components/communities/JoinedLianeView.tsx
@@ -4,93 +4,76 @@ import { AppText } from "@/components/base/AppText";
 import { extractDays } from "@/util/hooks/days";
 import { AppColors } from "@/theme/colors";
 import { UserPicture } from "@/components/UserPicture";
-import { MatchGroup } from "@liane/common";
 import { useAppNavigation } from "@/components/context/routing";
 import { Row } from "@/components/base/AppLayout.tsx";
+import { CoLiane, ResolvedLianeRequest } from "@liane/common";
 
 export interface GroupsViewProps {
-  joinedLiane: MatchGroup;
+  lianeRequest: ResolvedLianeRequest;
+  liane: CoLiane;
   unreadMessage?: boolean;
 }
 
-const RenderGroupsView = ({ joinedLiane, unreadMessage }: GroupsViewProps) => {
+export const JoinedLianeView = ({ lianeRequest, liane, unreadMessage }: GroupsViewProps) => {
+  const { navigation } = useAppNavigation();
+
   return (
-    <View style={{ flexGrow: 1, flexShrink: 1 }}>
-      <View style={{ flex: 1, flexDirection: "row" }}>
-        {unreadMessage && (
-          <View style={styles.notificationDotContainer}>
-            <View style={styles.notificationDot} />
-          </View>
-        )}
-      </View>
-      <Row style={{ alignItems: "flex-start", flexWrap: "wrap" }} spacing={4}>
+    <Pressable onPress={() => navigation.navigate("CommunitiesChat", { liane: liane })}>
+      <View style={{ flexGrow: 1, flexShrink: 1 }}>
+        <View style={{ flex: 1, flexDirection: "row" }}>
+          {unreadMessage && (
+            <View style={styles.notificationDotContainer}>
+              <View style={styles.notificationDot} />
+            </View>
+          )}
+        </View>
+        <Row style={{ alignItems: "flex-start", flexWrap: "wrap" }} spacing={4}>
+          <AppText
+            style={{
+              fontSize: 14,
+              fontWeight: "bold",
+              flexShrink: 1,
+              lineHeight: 14,
+              color: "black"
+            }}>
+            {`${lianeRequest.wayPoints[0].label} ➔`}
+          </AppText>
+          <AppText
+            style={{
+              fontSize: 14,
+              fontWeight: "bold",
+              flexShrink: 1,
+              lineHeight: 14,
+              color: "black"
+            }}>
+            {`${lianeRequest.wayPoints[1].label}`}
+          </AppText>
+        </Row>
+
         <AppText
           style={{
             fontSize: 14,
-            fontWeight: "bold",
+            fontWeight: "400",
             flexShrink: 1,
-            lineHeight: 14,
-            color: "black"
-          }}>
-          {`${joinedLiane.pickup.label} ➔`}
-        </AppText>
-        <AppText
+            lineHeight: 20
+          }}>{`${extractDays(lianeRequest.weekDays)}`}</AppText>
+        <View
           style={{
-            fontSize: 14,
-            fontWeight: "bold",
-            flexShrink: 1,
-            lineHeight: 14,
-            color: "black"
+            flex: 1,
+            flexDirection: "row",
+            marginLeft: 8,
+            marginTop: 5
           }}>
-          {`${joinedLiane.deposit.label}`}
-        </AppText>
-      </Row>
-
-      <AppText
-        style={{
-          fontSize: 14,
-          fontWeight: "400",
-          flexShrink: 1,
-          lineHeight: 20
-        }}>{`${extractDays(joinedLiane.weekDays)}`}</AppText>
-      <View
-        style={{
-          flex: 1,
-          flexDirection: "row",
-          marginLeft: 8,
-          marginTop: 5
-        }}>
-        {joinedLiane.liane.members.map(member => (
-          <UserPicture key={member.user.id} size={24} url={member.user.pictureUrl} id={member.user.id} style={{ marginLeft: -10 }} />
-        ))}
+          {liane.members.map(member => (
+            <UserPicture key={member.user.id} size={24} url={member.user.pictureUrl} id={member.user.id} style={{ marginLeft: -10 }} />
+          ))}
+        </View>
       </View>
-    </View>
-  );
-};
-
-export const JoinedLianeView = ({ joinedLiane, unreadMessage }: GroupsViewProps) => {
-  const { navigation } = useAppNavigation();
-
-  return (
-    <Pressable onPress={() => navigation.navigate("CommunitiesChat", { liane: joinedLiane.liane })}>
-      <RenderGroupsView joinedLiane={joinedLiane} unreadMessage={unreadMessage} />
     </Pressable>
   );
 };
 
 const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center" // Centre verticalement les éléments dans le conteneur
-  },
-  groupName: {
-    fontSize: 18,
-    fontWeight: "bold",
-    flexShrink: 1,
-    lineHeight: 27,
-    color: "black"
-  },
   notificationDotContainer: {
     justifyContent: "center",
     alignItems: "center"