// Android/web icon implementation using MaterialIcons.
// iOS uses icon-symbol.ios.tsx (SF Symbols via expo-symbols).
// IMPORTANT: Do NOT import from "expo-symbols" here — that package is iOS-only
// and will crash the Android bundle on startup.

import MaterialIcons from "@expo/vector-icons/MaterialIcons";
import { ComponentProps } from "react";
import { OpaqueColorValue, type StyleProp, type TextStyle } from "react-native";

// SF Symbol name → Material Icons name mapping.
// Add new entries here before using them in the app.
const MAPPING = {
  "house.fill":                               "home",
  "plus.circle.fill":                         "add-circle",
  "list.bullet":                              "format-list-bulleted",
  "gear":                                     "settings",
  "paperplane.fill":                          "send",
  "chevron.left.forwardslash.chevron.right":  "code",
  "chevron.right":                            "chevron-right",
  "chevron.left":                             "chevron-left",
  "trash":                                    "delete",
  "pencil":                                   "edit",
  "arrow.clockwise":                          "refresh",
  "xmark":                                    "close",
  "checkmark":                                "check",
  "heart.fill":                               "favorite",
  "waveform.path.ecg":                        "monitor-heart",
  "lungs.fill":                               "air",
  "drop.fill":                                "water-drop",
  "scalemass.fill":                           "monitor-weight",
  "thermometer":                              "device-thermostat",
  "chart.bar.fill":                           "bar-chart",
  "moon.zzz.fill":                            "bedtime",
  "chart.line.uptrend.xyaxis":                "trending-up",
  "arrow.up":                                 "arrow-upward",
  "arrow.down":                               "arrow-downward",
  "arrow.right":                              "arrow-forward",
  "info.circle":                              "info",
  "exclamationmark.triangle.fill":            "warning",
  "doc.text.fill":                            "description",
  "square.and.arrow.up":                      "share",
} as const satisfies Record<string, ComponentProps<typeof MaterialIcons>["name"]>;

export type IconSymbolName = keyof typeof MAPPING;

/**
 * Cross-platform icon component.
 * Uses native SF Symbols on iOS (via icon-symbol.ios.tsx) and
 * Material Icons on Android/web (this file).
 */
export function IconSymbol({
  name,
  size = 24,
  color,
  style,
}: {
  name: IconSymbolName;
  size?: number;
  color: string | OpaqueColorValue;
  style?: StyleProp<TextStyle>;
  weight?: string; // accepted but unused on Android/web
}) {
  return <MaterialIcons color={color} size={size} name={MAPPING[name]} style={style} />;
}
