yeet

modules/game_claim/native/GameClaimCardStack.tsx

@@ -0,0 +1,81 @@
+// Metro module 15161 (f15162).
+import { Image as Image2, View } from "react-native";
+import Module712 from "../../../_bundle/Module712";
+import Module689 from "../../../_bundle/Module689";
+import { createStyles } from "../../../design/components/Styles/native/createStyles";
+import { PlusSmallIcon } from "../../../design/components/Icon/native/redesign/generated/PlusSmallIcon";
+const r47 = Module712.space.PX_12 + Module712.space.PX_8 + 96 + 4 + Module712.space.PX_16;
+const useStyles = createStyles({
+  container: {
+    flexDirection: "row",
+    alignItems: "flex-start",
+    justifyContent: "center",
+    width: "100%",
+    paddingTop: Module712.space.PX_12,
+    paddingBottom: Module712.space.PX_16 + 4
+  },
+  gameCard: {
+    width: 72,
+    height: 96,
+    borderRadius: Module712.radii.xs,
+    overflow: "hidden",
+    flexShrink: 0,
+    transform: [{
+      rotate: "-6deg"
+    }],
+    shadowColor: Module712.colors.BLACK,
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.25,
+    shadowRadius: 4,
+    elevation: 4
+  },
+  gameImage: {
+    width: "100%",
+    height: "100%"
+  },
+  addCard: {
+    width: 72,
+    height: 96,
+    borderRadius: Module712.radii.xs,
+    flexShrink: 0,
+    transform: [{
+      rotate: "6deg"
+    }],
+    borderWidth: 2,
+    borderStyle: "dashed",
+    borderColor: Module689(Module712.unsafe_rawColors.BRAND_500).alpha(0.5).hex(),
+    backgroundColor: Module689(Module712.unsafe_rawColors.BRAND_500).alpha(0.25).hex(),
+    alignItems: "center",
+    justifyContent: "center",
+    marginStart: -Module712.space.PX_8,
+    marginTop: Module712.space.PX_8
+  },
+  addIconWrapper: {
+    width: 21.599999999999998,
+    height: 21.599999999999998,
+    borderRadius: Module712.radii.xs,
+    backgroundColor: Module689(Module712.unsafe_rawColors.BRAND_500).alpha(0.35).hex(),
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
+export default function GameClaimCardStack(props) {
+  const imageSrc = props.imageSrc;
+  const styles = useStyles();
+  return <View style={styles.container}>
+    <View style={styles.gameCard}>
+      <Image2 style={styles.gameImage} source={{
+        uri: imageSrc
+      }} resizeMode="cover" />
+    </View>
+    <View style={styles.addCard}>
+      <View style={styles.addIconWrapper}>
+        <PlusSmallIcon size="sm" color="text-brand" />
+      </View>
+    </View>
+  </View>;
+};
+export { r47 as CARD_STACK_HEIGHT };

modules/game_claim/native/GameClaimCoachmark.tsx

@@ -0,0 +1,84 @@
+// Metro module 15160 (f15161).
+import { memo } from "react";
+import { View } from "react-native";
+import { GuildFeatures, RelativeMarketingURLs } from "../../../Constants";
+import { ContentDismissActionType } from "../../dismissible_content/DismissibleContentConstants";
+import Module712 from "../../../_bundle/Module712";
+import GameClaimCardStack, { CARD_STACK_HEIGHT } from "./GameClaimCardStack";
+import { scaleTextLineHeight } from "../../screen/native/useScaledTextLineHeight.android";
+import { SMALL_BUTTON_HEIGHT } from "../../../design/components/Button/native/ButtonConstants.native";
+import { createStyles } from "../../../design/components/Styles/native/createStyles";
+import { useUnclaimedGameIdsForGuild } from "../UnclaimedGamesActionCreators";
+import useGameNameAndCoverImage from "../../games/hooks/useGameNameAndCoverImage";
+import { intl, t } from "../../../intl/index.native";
+import { Card } from "../../../design/components/Card/native/Card.native";
+import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
+import { XSmallIcon } from "../../../design/components/Icon/native/redesign/generated/XSmallIcon";
+import { Text } from "../../../design/components/Text/native/Text";
+import { Button } from "../../../design/components/Button/native/Button.native";
+import { LinkExternalSmallIcon } from "../../../design/components/Icon/native/redesign/generated/LinkExternalSmallIcon";
+import MobileWebHandoffLinking from "../../mobile_web_handoff/native/MobileWebHandoffLinking";
+const PX_8 = Module712.space.PX_8;
+const PX_82 = Module712.space.PX_8;
+let c10756_12 = 2 * Module712.space.PX_12;
+const useStyles = createStyles({
+  card: {
+    padding: Module712.space.PX_12
+  },
+  closeButton: {
+    position: "absolute",
+    top: Module712.space.PX_12,
+    right: Module712.space.PX_12,
+    width: 24,
+    height: 24,
+    alignItems: "center",
+    justifyContent: "center",
+    zIndex: 1
+  },
+  centeredText: {
+    textAlign: "center"
+  },
+  body: {
+    marginTop: Module712.space.PX_4
+  },
+  cta: {
+    marginTop: Module712.space.PX_8
+  }
+});
+const r77 = memo(function({ guild, markAsDismissed }) {
+  const styles = useStyles();
+  let r25 = useUnclaimedGameIdsForGuild(guild.id)[0];
+  if (r25 == null) {
+    r25 = null;
+  }
+  const gameNameAndCoverImage = useGameNameAndCoverImage(r25, intl.string(t.VQq92a));
+  const { coverImageUrl, gameName } = gameNameAndCoverImage;
+  if (coverImageUrl == null) {
+    return null;
+  }
+  const r10 = guild.features.has(GuildFeatures.VERIFIED) ? intl.string(t.uUARXe) : intl.string(t["0Dx29f"]);
+  return <Card variant="secondary" style={styles.card}>
+    <PressableOpacity accessibilityRole="button" onPress={() => markAsDismissed(ContentDismissActionType.USER_DISMISS)} style={styles.closeButton}>
+      <XSmallIcon size="sm" color="text-default" />
+    </PressableOpacity>
+    <GameClaimCardStack imageSrc={coverImageUrl} />
+    <Text variant="text-md/medium" color="text-overlay-light" style={styles.centeredText}>
+      {intl.format(t.Q11WTQ, {
+        gameName
+      })}
+    </Text>
+    <Text variant="text-sm/normal" color="text-overlay-light" style={[styles.body, styles.centeredText]}>{r10}</Text>
+    <View style={styles.cta}>
+      <Button variant="primary" size="sm" text={intl.string(t["2u6ZlY"])} icon={<LinkExternalSmallIcon size="xs" color="white" />} iconPosition="end" onPress={async () => {
+        markAsDismissed(ContentDismissActionType.TAKE_ACTION);
+        await MobileWebHandoffLinking.redirectDeveloperPortalWithHandoffToken(RelativeMarketingURLs.DEVELOPER_PORTAL_APPLICATIONS_GAME_IDENTITY);
+      }} />
+    </View>
+  </Card>;
+});
+export default r77;
+export { PX_8 as GAME_CLAIM_NOTICE_MARGIN_TOP };
+export { PX_82 as GAME_CLAIM_NOTICE_MARGIN_BOTTOM };
+export function getScaledGameClaimNoticeHeight(a0) {
+  return PX_8 + c10756_12 + CARD_STACK_HEIGHT + scaleTextLineHeight("text-md/medium", a0) + Module712.space.PX_4 + 2 * scaleTextLineHeight("text-sm/normal", a0) + Module712.space.PX_8 + SMALL_BUTTON_HEIGHT + PX_82;
+}