21935229190

Committed 12 Feb 2026 05:49AM UTC coverage: 64.742%. First build

Build # 21935229190

Build Type

Pull #127

github

Committed by

web-flow

Commit Message

Merge 4a7599785 into af48ebeae

Pull Request Pull Request #127: refactor: decompose 8 large files into focused components

Run Details

1379 of 2375 branches covered (58.06%)

Branch coverage included in aggregate %.

55 of 103 new or added lines in 19 files covered. (53.4%)

2253 of 3235 relevant lines covered (69.64%)

22.25 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

38.46

/src/components/onboarding/DeviceCodeDisplay.tsx

/**
 * DeviceCodeDisplay
 *
 * Shows the device code for GitHub Device Flow authentication,
 * with a button to open GitHub.
 */

import { ActivityIndicator, Pressable, View } from 'react-native';
import { LinkIcon } from '@/components/icons';
import { VStack } from '@/components/layout';
import { Text } from '@/components/ui';
import { organicBorderRadius } from '@/lib/organic-styles';
import { getColor } from '@/utils/design-tokens';

interface DeviceCodeDisplayProps {
  userCode: string | null;
  isAuthenticating: boolean;
  onStartDeviceFlow: () => void;
  onOpenGitHub: () => void;
  onCheckAuth: () => void;
}

export function DeviceCodeDisplay({
  userCode,
  isAuthenticating,
  onStartDeviceFlow,
  onOpenGitHub,
  onCheckAuth,
}: Readonly<DeviceCodeDisplayProps>) {
  if (!userCode) {
    return (
      <VStack spacing="lg">
        <View className="bg-surface p-6" style={organicBorderRadius.card}>
          <View className="items-center mb-4">
            <LinkIcon size={40} color="teal" turbulence={0.25} />
          </View>
          <Text weight="semibold" className="text-white text-center mb-2">
            Secure Device Flow
          </Text>
          <Text size="sm" className="text-neutral-400 text-center">
            We use GitHub's Device Flow authentication - your credentials are never shared with
            us.
          </Text>
        </View>

        <Pressable
          onPress={onStartDeviceFlow}
          disabled={isAuthenticating}
          className={`bg-neutral-800 py-4 ${isAuthenticating ? 'opacity-70' : 'active:bg-neutral-700'}`}
          style={organicBorderRadius.cta}
        >
          {isAuthenticating ? (
            <ActivityIndicator color={getColor('neutral', '50')} />
          ) : (
            <Text weight="semibold" className="text-white text-center">
              Start GitHub Authentication
            </Text>
          )}
        </Pressable>
      </VStack>
    );
  }

  return (
    <VStack spacing="lg">
      <View className="bg-surface p-6" style={organicBorderRadius.card}>
        <Text size="sm" className="text-neutral-400 text-center mb-2">
          Enter this code on GitHub:
        </Text>
        <Text
          variant="display"
          size="3xl"
          weight="bold"
          className="text-coral-500 text-center tracking-wider"
        >
          {userCode}
        </Text>
      </View>

      <Pressable
        onPress={onOpenGitHub}
        className="bg-neutral-800 py-4 active:bg-neutral-700"
        style={organicBorderRadius.cta}
      >
        <Text weight="semibold" className="text-white text-center">
          Open GitHub →
        </Text>
      </Pressable>

      <Pressable
        onPress={onCheckAuth}
        disabled={isAuthenticating}
        className={`bg-teal-600 py-4 ${isAuthenticating ? 'opacity-70' : 'active:bg-teal-700'}`}
        style={organicBorderRadius.cta}
      >
        {isAuthenticating ? (
          <ActivityIndicator color={getColor('neutral', '50')} />
        ) : (
          <Text weight="semibold" className="text-white text-center">
            I've Entered the Code
          </Text>
        )}
      </Pressable>
    </VStack>
  );
}

1	/**
2	* DeviceCodeDisplay
3	*
4	* Shows the device code for GitHub Device Flow authentication,
5	* with a button to open GitHub.
6	*/
7
8	import { ActivityIndicator, Pressable, View } from 'react-native';
9	import { LinkIcon } from '@/components/icons';
10	import { VStack } from '@/components/layout';
11	import { Text } from '@/components/ui';
12	import { organicBorderRadius } from '@/lib/organic-styles';
13	import { getColor } from '@/utils/design-tokens';
14
15	interface DeviceCodeDisplayProps {
16	userCode: string \| null;
17	isAuthenticating: boolean;
18	onStartDeviceFlow: () => void;
19	onOpenGitHub: () => void;
20	onCheckAuth: () => void;
21	}
22
23	export function DeviceCodeDisplay({
24	userCode,
25	isAuthenticating,
26	onStartDeviceFlow,
27	onOpenGitHub,
28	onCheckAuth,
29	}: Readonly<DeviceCodeDisplayProps>) {
30	if (!userCode) {	4!
31	return (	4✔
32	<VStack spacing="lg">
33	<View className="bg-surface p-6" style={organicBorderRadius.card}>
34	<View className="items-center mb-4">
35	<LinkIcon size={40} color="teal" turbulence={0.25} />
36	</View>
37	<Text weight="semibold" className="text-white text-center mb-2">
38	Secure Device Flow
39	</Text>
40	<Text size="sm" className="text-neutral-400 text-center">
41	We use GitHub's Device Flow authentication - your credentials are never shared with
42	us.
43	</Text>
44	</View>
45
46	<Pressable
47	onPress={onStartDeviceFlow}
48	disabled={isAuthenticating}
49	className={`bg-neutral-800 py-4 ${isAuthenticating ? 'opacity-70' : 'active:bg-neutral-700'}`}	4!
50	style={organicBorderRadius.cta}
51	>
52	{isAuthenticating ? (	4!
53	<ActivityIndicator color={getColor('neutral', '50')} />
54	) : (
55	<Text weight="semibold" className="text-white text-center">
56	Start GitHub Authentication
57	</Text>
58	)}
59	</Pressable>
60	</VStack>
61	);
62	}
63
NEW 64	return (	×
65	<VStack spacing="lg">
66	<View className="bg-surface p-6" style={organicBorderRadius.card}>
67	<Text size="sm" className="text-neutral-400 text-center mb-2">
68	Enter this code on GitHub:
69	</Text>
70	<Text
71	variant="display"
72	size="3xl"
73	weight="bold"
74	className="text-coral-500 text-center tracking-wider"
75	>
76	{userCode}
77	</Text>
78	</View>
79
80	<Pressable
81	onPress={onOpenGitHub}
82	className="bg-neutral-800 py-4 active:bg-neutral-700"
83	style={organicBorderRadius.cta}
84	>
85	<Text weight="semibold" className="text-white text-center">
86	Open GitHub →
87	</Text>
88	</Pressable>
89
90	<Pressable
91	onPress={onCheckAuth}
92	disabled={isAuthenticating}
93	className={`bg-teal-600 py-4 ${isAuthenticating ? 'opacity-70' : 'active:bg-teal-700'}`}	×
94	style={organicBorderRadius.cta}
95	>
96	{isAuthenticating ? (	×
97	<ActivityIndicator color={getColor('neutral', '50')} />
98	) : (
99	<Text weight="semibold" className="text-white text-center">
100	I've Entered the Code
101	</Text>
102	)}
103	</Pressable>
104	</VStack>
105	);
106	}

agentic-dev-library / thumbcode / 21935229190

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous