import React from "react";
import type { ComponentProps } from "react";
import { action } from "storybook/actions";
import { Card, Content, Text } from "@jobber/components-native";

export function CardPressableExample(
  props: Partial<ComponentProps<typeof Card>>,
) {
  return (
    <Card
      header={{
        title: "Your address",
        actionItem: { iconName: "plus2" },
        onPress: () => action("alert")("🏡"),
      }}
      footer={{
        title: "View All",
        onPress: () => action("alert")("View all"),
      }}
      {...props}
    >
      <Content childSpacing={"small"}>
        <Content spacing={"none"} childSpacing={"none"}>
          <Text variation={"subdued"}>Address</Text>
          <Text>12345 Fake Street</Text>
        </Content>
        <Content spacing={"none"} childSpacing={"none"}>
          <Text variation={"subdued"}>Phone</Text>
          <Text>555-555-5555</Text>
        </Content>
      </Content>
    </Card>
  );
}