Waseel: driver app, dispatch, POI suggestions, map fixes

2026-08-25 02:57:49 +03:00
parent 899ca93cd5
commit 1d84003e0a
50 changed files with 3625 additions and 625 deletions
@@ -0,0 +1,109 @@
+import { MaterialCommunityIcons } from "@expo/vector-icons";
+import { Switch, Text, TouchableOpacity, View } from "react-native";
+
+import { useTheme } from "@/lib/theme";
+
+type IconName = React.ComponentProps<typeof MaterialCommunityIcons>["name"];
+
+type RightKind = "chevron" | "switch" | "value" | "none";
+
+type SettingsRowProps = {
+  icon: IconName;
+  title: string;
+  subtitle?: string;
+  right?: RightKind;
+  /** For `right: "value"` — the string shown on the trailing side. */
+  value?: string;
+  /** For `right: "switch"`. */
+  switchValue?: boolean;
+  onSwitchChange?: (value: boolean) => void;
+  onPress?: () => void;
+  /** Red accent — used for the emergency-call row. */
+  danger?: boolean;
+};
+
+/** A single row in the Settings screen. Born dark-aware. */
+export const SettingsRow = ({
+  icon,
+  title,
+  subtitle,
+  right = "none",
+  value,
+  switchValue,
+  onSwitchChange,
+  onPress,
+  danger = false,
+}: SettingsRowProps) => {
+  const { isDark } = useTheme();
+  const interactive = right === "chevron" || right === "value";
+
+  const content = (
+    <View className="flex-row items-center py-3.5">
+      <View
+        className={`w-10 h-10 rounded-full items-center justify-center mr-3.5 ${
+          danger
+            ? "bg-rose-500/15"
+            : "bg-neutral-100 dark:bg-neutral-800"
+        }`}
+      >
+        <MaterialCommunityIcons
+          name={icon}
+          size={20}
+          color={danger ? "#e11d48" : isDark ? "#e5e5e5" : "#404040"}
+        />
+      </View>
+
+      <View className="flex-1">
+        <Text
+          className={`text-[15px] font-JakartaSemiBold ${
+            danger ? "text-rose-600 dark:text-rose-400" : "text-black dark:text-white"
+          }`}
+        >
+          {title}
+        </Text>
+
+        {subtitle ? (
+          <Text className="text-xs font-Jakarta text-general-200 dark:text-neutral-400 mt-0.5">
+            {subtitle}
+          </Text>
+        ) : null}
+      </View>
+
+      {right === "switch" ? (
+        <Switch
+          value={switchValue}
+          onValueChange={onSwitchChange}
+          trackColor={{ false: "#d4d4d4", true: "#0286ff" }}
+        />
+      ) : null}
+
+      {right === "value" ? (
+        <Text className="text-sm font-JakartaMedium text-general-200 dark:text-neutral-400 mr-1">
+          {value}
+        </Text>
+      ) : null}
+
+      {right === "chevron" ? (
+        <MaterialCommunityIcons
+          name="chevron-right"
+          size={22}
+          color={isDark ? "#737373" : "#a3a3a3"}
+        />
+      ) : null}
+    </View>
+  );
+
+  if (right === "switch" || !interactive || !onPress) {
+    return <View className="px-4">{content}</View>;
+  }
+
+  return (
+    <TouchableOpacity
+      onPress={onPress}
+      activeOpacity={0.6}
+      className="px-4"
+    >
+      {content}
+    </TouchableOpacity>
+  );
+};