husky added

Author: emon5122

.husky/pre-commit

@@ -0,0 +1 @@
+pnpm tsc

app/chat.tsx

@@ -1,10 +1,12 @@
+import OthersChat from "@/components/chat/others-chat";
 import SelfChat from "@/components/chat/self-chat";
 import { Link } from "expo-router";
 import { View } from "react-native";
 
 const ChatScreen = () => {
     return (
         <View>
+            <OthersChat />
             <SelfChat />
             <Link href="/">Home</Link>
         </View>

components/chat/others-chat.tsx

@@ -0,0 +1,90 @@
+import { StyleSheet, Text, useWindowDimensions, View } from "react-native";
+
+const OthersChat = () => {
+    const { height } = useWindowDimensions();
+
+    return (
+        <View style={styles.othersChatContainer}>
+            <View style={styles.ChatContainer}>
+                <Text style={styles.text}>
+                    Lorem ipsum dolor sit amet consectetur adipisicing elit.
+                    Minus, labore neque perferendis id dolor minima ad aliquam
+                    ex, sed debitis quos, unde animi. Et eligendi quas magnam
+                    cum eveniet? Praesentium!
+                </Text>
+                <View
+                    style={[
+                        styles.triangle,
+                        styles.triangleBorder,
+                        {
+                            borderLeftWidth: height * 0.005,
+                            borderRightWidth: height * 0.005,
+                            borderTopWidth: height * 0.035,
+                        },
+                    ]}
+                />
+                <View
+                    style={[
+                        styles.triangle,
+                        styles.triangleFill,
+                        {
+                            borderLeftWidth: height * 0.004,
+                            borderRightWidth: height * 0.004,
+                            borderTopWidth: height * 0.033,
+                        },
+                    ]}
+                />
+            </View>
+        </View>
+    );
+};
+
+const styles = StyleSheet.create({
+    othersChatContainer: {
+        flexDirection: "row",
+        marginVertical: 10,
+        marginHorizontal: 15,
+    },
+    ChatContainer: {
+        maxWidth: "75%",
+        backgroundColor: "#FFFFFF",
+        borderWidth: 1,
+        borderColor: "#EEEEEE",
+        borderRadius: 10,
+        padding: 12,
+        position: "relative",
+    },
+    text: {
+        color: "black",
+        fontSize: 16,
+        fontFamily: "Rubik_400Regular",
+        lineHeight: 20,
+    },
+    triangle: {
+        width: 0,
+        height: 0,
+        borderLeftColor: "transparent",
+        borderRightColor: "transparent",
+        borderStyle: "solid",
+        position: "absolute",
+        left: -12,
+        bottom: 8,
+        transform: [{ rotate: "45deg" }],
+    },
+    triangleBorder: {
+        borderTopColor: "#CFD8DC",
+        borderLeftWidth: 8,
+        borderRightWidth: 8,
+        borderTopWidth: 8,
+    },
+    triangleFill: {
+        borderTopColor: "#FFFFFF",
+        borderLeftWidth: 7,
+        borderRightWidth: 7,
+        borderTopWidth: 7,
+        left: -11,
+        bottom: 9,
+    },
+});
+
+export default OthersChat;

components/chat/self-chat.tsx

@@ -53,8 +53,6 @@ const styles = StyleSheet.create({
         color: "#fff",
         fontSize: 16,
         fontFamily: "Rubik_400Regular",
-        textAlign: "center",
-        paddingHorizontal: 15,
     },
     triangle: {
         width: 0,

package.json

@@ -9,7 +9,9 @@
     "ios": "expo start --ios",
     "web": "expo start --web",
     "test": "jest --watchAll",
-    "lint": "expo lint"
+    "lint": "expo lint",
+    "ts": "tsc --noEmit",
+    "prepare": "husky"
   },
   "jest": {
     "preset": "jest-expo"
@@ -20,7 +22,7 @@
     "@expo/vector-icons": "^14.0.4",
     "@react-navigation/bottom-tabs": "^7.2.0",
     "@react-navigation/native": "^7.0.14",
-    "expo": "~52.0.28",
+    "expo": "~52.0.29",
     "expo-blur": "~14.0.3",
     "expo-constants": "~17.0.5",
     "expo-font": "~13.0.3",
@@ -49,10 +51,11 @@
     "@types/jest": "^29.5.14",
     "@types/react": "~18.3.18",
     "@types/react-test-renderer": "^18.3.1",
+    "husky": "^9.1.7",
     "jest": "^29.7.0",
     "jest-expo": "~52.0.3",
     "react-test-renderer": "18.3.1",
     "typescript": "^5.7.3"
   },
   "private": true
-}
+}