Dhairyashil Shinde
60a4d3f2b4
* feat(companion): add DropdownMenu for Android event types list Replace Alert.alert with react-native-reusables DropdownMenu component for Android event type list items, providing a native-feeling menu experience that matches iOS functionality. Changes: - Install react-native-reusables dropdown-menu component and dependencies (lucide-react-native, tailwindcss-animate, class-variance-authority, clsx, tailwind-merge) - Create EventTypeListItem.android.tsx with DropdownMenu implementation - Single ellipsis button triggers dropdown menu - Menu includes: Preview, Copy link, Edit, Duplicate, Delete - Delete action marked as destructive variant - Proper safe area insets handling - Add PortalHost to app/_layout.tsx for portal rendering support - Create lib/utils.ts with cn() helper for className merging - Update global.css with theme CSS variables (popover, border, accent, destructive, etc.) for dropdown menu styling - Update tailwind.config.js with theme colors and tailwindcss-animate plugin - Update metro.config.js with inlineRem: 16 for proper rem unit handling - Remove Android Alert.alert fallback from event types index.tsx - Fix lint issues in generated dropdown-menu.tsx (remove unnecessary fragments) The Android experience now matches iOS with a single menu button that opens a dropdown containing all event type actions, replacing the previous Alert.alert dialog and separate action buttons. Refs: https://reactnativereusables.com/docs/components/dropdown-menu * adjust with of menu * feat(companion): add DropdownMenu for Android booking and availability list items - Add BookingListItem.android.tsx with DropdownMenu for booking actions - Add BookingDetailScreen.android.tsx with DropdownMenu in header - Add AvailabilityListItem.android.tsx with DropdownMenu for schedule actions Actions include: Reschedule, Edit Location, Add Guests, View Recordings, Meeting Session Details, Mark as No-Show, Report Booking, Cancel Event for bookings; Set as Default, Duplicate, Delete for availability schedules. * fix lint issues * feat(android): replace native alerts with AlertDialog and Toast in event types - Install AlertDialog and Alert components from react-native-reusables - Create Android-specific event types screen (index.android.tsx) - Replace native Alert.alert() with AlertDialog for delete confirmation - Add inline validation errors (red border + error text) in create modal - Implement Toast snackbar for success/error notifications (no layout shift) - Auto-dismiss toast after 2.5 seconds - Fix React Compiler compatibility by removing animated refs This provides a more consistent and polished UI experience on Android, matching the design system used in other parts of the app. * feat(android): add AlertDialog for availability delete and booking cancel - Add index.android.tsx for availability with AlertDialog for delete confirmation - Add index.android.tsx for bookings with AlertDialog for cancel (with reason input) - Both screens include Toast snackbar for success/error notifications - Follows the same pattern as event types Android implementation * feat(companion): add DropdownMenu and AlertDialog for Android - Replace native Alert.alert context menus with DropdownMenu component for event types, bookings, and availability lists - Replace FullScreenModal with AlertDialog for create/delete/cancel flows - Add toast notifications for success/error feedback on Android - Set consistent 380px max-width for all AlertDialogs - Fix layout headers showing "index" text on event-types and availability - Create Android-specific More screen with AlertDialog logout confirmation Uses react-native-reusables components for polished Android UI * better code * fix cubics comments * refactor(android): revert delete confirmations to native Alert.alert() - Logout: reverted to native Alert.alert() (simple yes/no) - Event Types Delete: reverted to native Alert.alert() (simple yes/no) - Availability Delete: reverted to native Alert.alert() (simple yes/no) Keep AlertDialog only where user input is needed: - Event Types Create (has TextInput for title) - Availability Create (has TextInput for name) - Bookings Cancel (has TextInput for cancellation reason) * refactor(android): remove redundant index.android.tsx files The main index.tsx files already handle Android via Platform.OS checks. Android-specific behavior for actions is in the list item components: - EventTypeListItem.android.tsx - BookingListItem.android.tsx - AvailabilityListItem.android.tsx This consolidates the code and reduces duplication. * corrected the implementation both native and alert dialog * address cubics comments * fix lint issue and address cubic comments
83 lines
2.2 KiB
JavaScript
83 lines
2.2 KiB
JavaScript
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
content: ["./app/**/*.{js,jsx,ts,tsx}", "./components/**/*.{js,jsx,ts,tsx}"],
|
|
presets: [require("nativewind/preset")],
|
|
darkMode: "class",
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
border: "hsl(var(--border))",
|
|
input: "hsl(var(--input))",
|
|
ring: "hsl(var(--ring))",
|
|
background: "hsl(var(--background))",
|
|
foreground: "hsl(var(--foreground))",
|
|
primary: {
|
|
DEFAULT: "hsl(var(--primary))",
|
|
foreground: "hsl(var(--primary-foreground))",
|
|
},
|
|
secondary: {
|
|
DEFAULT: "hsl(var(--secondary))",
|
|
foreground: "hsl(var(--secondary-foreground))",
|
|
},
|
|
destructive: {
|
|
DEFAULT: "hsl(var(--destructive))",
|
|
foreground: "hsl(var(--destructive-foreground))",
|
|
},
|
|
muted: {
|
|
DEFAULT: "hsl(var(--muted))",
|
|
foreground: "hsl(var(--muted-foreground))",
|
|
},
|
|
accent: {
|
|
DEFAULT: "hsl(var(--accent))",
|
|
foreground: "hsl(var(--accent-foreground))",
|
|
},
|
|
popover: {
|
|
DEFAULT: "hsl(var(--popover))",
|
|
foreground: "hsl(var(--popover-foreground))",
|
|
},
|
|
card: {
|
|
DEFAULT: "hsl(var(--card))",
|
|
foreground: "hsl(var(--card-foreground))",
|
|
},
|
|
cal: {
|
|
text: {
|
|
DEFAULT: "#333333",
|
|
secondary: "#666666",
|
|
muted: "#8E8E93",
|
|
emphasis: "#3C3F44",
|
|
},
|
|
bg: {
|
|
DEFAULT: "#FFFFFF",
|
|
secondary: "#F8F9FA",
|
|
muted: "#F2F2F7",
|
|
},
|
|
border: {
|
|
DEFAULT: "#E5E5EA",
|
|
light: "#C6C6C8",
|
|
},
|
|
accent: {
|
|
DEFAULT: "#007AFF",
|
|
success: "#34C759",
|
|
warning: "#FF9500",
|
|
error: "#FF3B30",
|
|
destructive: "#DC2626",
|
|
},
|
|
brand: {
|
|
DEFAULT: "#292929",
|
|
black: "#000000",
|
|
},
|
|
},
|
|
},
|
|
borderRadius: {
|
|
lg: "var(--radius)",
|
|
md: "calc(var(--radius) - 2px)",
|
|
sm: "calc(var(--radius) - 4px)",
|
|
},
|
|
spacing: {
|
|
18: "4.5rem",
|
|
},
|
|
},
|
|
},
|
|
plugins: [require("tailwindcss-animate")],
|
|
};
|