Set up E2E test framework for Android using WebdriverIO, Appium, and UiAutomator2. Add testID props to key components (AuthButton, BaseButton, ChatBubble, CustomTextInput, ProposedEventCard) and apply testIDs to login screen, chat screen, tab bar, and settings. Include initial tests for app launch detection and login flow validation. Update CLAUDE.md with E2E docs.
41 lines
899 B
TypeScript
41 lines
899 B
TypeScript
import { View, ViewStyle } from "react-native";
|
|
import { useThemeStore } from "../stores/ThemeStore";
|
|
|
|
type BubbleSide = "left" | "right";
|
|
|
|
type ChatBubbleProps = {
|
|
side: BubbleSide;
|
|
children: React.ReactNode;
|
|
className?: string;
|
|
style?: ViewStyle;
|
|
testID?: string;
|
|
};
|
|
|
|
export function ChatBubble({
|
|
side,
|
|
children,
|
|
className = "",
|
|
style,
|
|
testID,
|
|
}: ChatBubbleProps) {
|
|
const { theme } = useThemeStore();
|
|
const borderColor = side === "left" ? theme.chatBot : theme.primeFg;
|
|
const sideClass =
|
|
side === "left"
|
|
? "self-start ml-2 rounded-bl-sm"
|
|
: "self-end mr-2 rounded-br-sm";
|
|
|
|
return (
|
|
<View
|
|
testID={testID}
|
|
className={`border-2 border-solid rounded-xl my-2 ${sideClass} ${className}`}
|
|
style={[
|
|
{ borderColor, elevation: 8, backgroundColor: theme.secondaryBg },
|
|
style,
|
|
]}
|
|
>
|
|
{children}
|
|
</View>
|
|
);
|
|
}
|