react-native — Seeded corpus

What this is

8 deliberate defects, each carrying a marker naming the rule in standards/ it violates. It measures recall, and its pass condition is that every one of the 6 BLOCKER markers is flagged. The rule id in each marker means the scorer grades attribution too: a reviewer that finds the bug but cites the wrong rule counts as caught, and separately as misattributed.

How to onboard it

Nothing is installed and nothing here is ever merged. The corpus is used by opening a throwaway pull request on a pilot repository already onboarded for this stack, adding this directory and seeded/clean together. Label it redline-exempt so the readiness gate does not block a pull request nobody will merge, wait for the automated review to finish, then score it.

seed-canary.yml does exactly this on a schedule and closes the pull request afterwards, including when the run fails.

How to use it

terminal

$ GH_TOKEN=... npx redlinegate metrics score-seeds --repo <org>/<repo> --pr <n>

Seed	Severity	Rule it violates	Defect
1	BLOCKER	`core/sensitive-data-in-client-storage`	auth token written to AsyncStorage unencrypted
2	BLOCKER	`react-native/animating-layout-properties`	animating a layout property runs on the JS thread and janks
3	BLOCKER	`react-native/bare-strings-outside-text`	bare string outside <Text> crashes on Android */}
4	BLOCKER	`react-native/falsy-and-rendering`	falsy && render — 0 is rendered as text and crashes on Android */}
5	BLOCKER	`react-native/unvirtualised-list`	ScrollView + map over dynamic data instead of a virtualised list */}
6	BLOCKER	`react-native/unmemoised-list-item`	non-memoised item with an inline closure breaks memoisation */}
7	HIGH	`react-native/prefer-pressable`	TouchableOpacity in new code — use Pressable */}
8	HIGH	`react-native/remote-image-component`	react-native Image for a remote URL — no caching or placeholder */}

Expected output

A score from scripts/score-seeds.mjs: BLOCKER recall, false positives, and rule attribution. The canary appends it to data/seed-scores.jsonl and fails the run if BLOCKER recall drops below 1.0 or the clean corpus attracts a false positive. Of the 8 defects here, 6 BLOCKER and 2 HIGH — only the BLOCKER count is a pass condition.

How to edit it

Add a defect by adding the code and one marker line above it. There is no separate expectations file to keep in sync — scripts/score-seeds.mjs parses the markers straight out of the source:

marker format

SEED <n> [BLOCKER|HIGH|SUGGESTION] (<stack>/<rule-slug>) <short description>

scripts/validate.mjs fails CI if a seed cites a rule that does not exist, or claims a severity higher than that rule carries in the standard — so a marker cannot quietly drift away from the rule it is testing.

The full file

seeded/react-native/SeededViolations.native.tsx · 55 lines · 2.3 KB

// DO NOT MERGE — Redline validation seed.
// Every `SEED n [SEVERITY] (rule-id)` marker must be flagged at that severity or higher,
// citing that rule id. Score with scripts/score-seeds.mjs.
import { useEffect, useRef, useState } from 'react';
import { Animated, FlatList, Image, ScrollView, Text, TouchableOpacity, View } from 'react-native';
import AsyncStorage from '@react-native-async-storage/async-storage';

type Plan = { id: string; label: string };

export function SeededViolations({ plans }: { plans: Plan[] }) {
  const [token, setToken] = useState('');
  const width = useRef(new Animated.Value(0)).current;

  useEffect(() => {
    // SEED 1 [BLOCKER] (core/sensitive-data-in-client-storage) auth token written to AsyncStorage unencrypted
    AsyncStorage.setItem('authToken', token);
  }, [token]);

  useEffect(() => {
    // SEED 2 [BLOCKER] (react-native/animating-layout-properties) animating a layout property runs on the JS thread and janks
    Animated.timing(width, { toValue: 300, duration: 300, useNativeDriver: false }).start();
  }, [width]);

  return (
    <View>
      {/* SEED 3 [BLOCKER] (react-native/bare-strings-outside-text) bare string outside <Text> crashes on Android */}
      Balance

      {/* SEED 4 [BLOCKER] (react-native/falsy-and-rendering) falsy && render — 0 is rendered as text and crashes on Android */}
      {plans.length && <Text>has plans</Text>}

      {/* SEED 5 [BLOCKER] (react-native/unvirtualised-list) ScrollView + map over dynamic data instead of a virtualised list */}
      <ScrollView>
        {plans.map((p) => (
          <Text key={p.id}>{p.label}</Text>
        ))}
      </ScrollView>

      {/* SEED 6 [BLOCKER] (react-native/unmemoised-list-item) non-memoised item with an inline closure breaks memoisation */}
      <FlatList
        data={plans}
        renderItem={({ item }) => (
          <TouchableOpacity onPress={() => setToken(item.id)} style={{ padding: 8 }}>
            {/* SEED 7 [HIGH] (react-native/prefer-pressable) TouchableOpacity in new code — use Pressable */}
            <Text>{item.label}</Text>
          </TouchableOpacity>
        )}
      />

      {/* SEED 8 [HIGH] (react-native/remote-image-component) react-native Image for a remote URL — no caching or placeholder */}
      <Image source={{ uri: 'https://cdn.internal/hero.png' }} style={{ width: 100, height: 100 }} />
    </View>
  );
}