yaver-feedback-react-native 0.8.1 → 0.8.2

package/src/P2PClient.ts

@@ -7,6 +7,15 @@ export interface FeedbackEvent {
   data: any;
 }
 
+export interface ReloadAck {
+  ok: boolean;
+  mode: 'dev' | 'bundle';
+  acknowledged: boolean;
+  message: string;
+  nativeChangesDetected?: boolean;
+  changeClass?: string;
+}
+
 /**
  * Try to resolve `{projectName, bundleId}` for the running app so the
  * agent can map the reload request to a MobileProject in its scan
@@ -317,7 +326,7 @@ export class P2PClient {
   async reloadApp(
     mode: 'dev' | 'bundle' = 'bundle',
     opts?: { projectName?: string; bundleId?: string; projectPath?: string },
-  ): Promise<{ ok: boolean }> {
+  ): Promise<ReloadAck> {
     // Default path: always rebuild a fresh Hermes bundle.
     //
     // Rationale: the SDK's common caller is a phone user who's not
@@ -338,7 +347,19 @@ export class P2PClient {
         headers: { Authorization: `Bearer ${this.authToken}` },
       });
       if (primary.ok) {
-        return primary.json().catch(() => ({ ok: true }));
+        const payload = await primary.json().catch(() => ({} as Record<string, unknown>));
+        const nativeChangesDetected = payload.nativeChangesDetected === true;
+        return {
+          ok: true,
+          mode: 'dev',
+          acknowledged: true,
+          nativeChangesDetected,
+          changeClass:
+            typeof payload.changeClass === 'string' ? payload.changeClass : undefined,
+          message: nativeChangesDetected
+            ? 'Reload accepted, but native changes need a rebuild.'
+            : 'Hot reload request accepted.',
+        };
       }
       // Dev mode failed — fall through to bundle rebuild below rather
       // than surfacing the raw error, so the user never has to know
@@ -370,7 +391,19 @@ export class P2PClient {
       const text = await res.text().catch(() => '');
       throw new Error(friendlyReloadError(res.status, text));
     }
-    return res.json().catch(() => ({ ok: true }));
+    const payload = await res.json().catch(() => ({} as Record<string, unknown>));
+    return {
+      ok: true,
+      mode: 'bundle',
+      acknowledged: true,
+      changeClass:
+        typeof payload.changeClass === 'string' ? payload.changeClass : undefined,
+      nativeChangesDetected: payload.nativeChangesDetected === true,
+      message:
+        typeof payload.message === 'string' && payload.message.trim()
+          ? payload.message
+          : 'Reload request acknowledged. Agent is rebuilding the bundle.',
+    };
   }
 
   /**

package/src/QuickActionIcon.tsx

@@ -12,7 +12,13 @@ import {
   View,
 } from 'react-native';
 import { YaverFeedback } from './YaverFeedback';
-import { getQuickIconDisabled, setQuickIconDisabled } from './preferences';
+import {
+  getQuickIconColorPreset,
+  getQuickIconDisabled,
+  QUICK_ICON_COLOR_PRESETS,
+  setQuickIconColorPreset,
+  setQuickIconDisabled,
+} from './preferences';
 
 // Mirror the suppression rule used by YaverFeedback + ShakeDetector:
 // when loaded through Yaver's super-host Hermes bundle, the host owns
@@ -123,6 +129,7 @@ export const QuickActionIcon: React.FC<QuickActionIconProps> = ({
   const didDrag = useRef(false);
 
   const [userDisabled, setUserDisabled] = useState<boolean | null>(null);
+  const [colorPreset, setColorPreset] = useState<keyof typeof QUICK_ICON_COLOR_PRESETS | null>(null);
   const [shakenThisSession, setShakenThisSession] = useState(false);
   const [menuOpen, setMenuOpen] = useState(false);
   const [hostSuppressed] = useState<boolean>(() => isRunningInsideYaverHost());
@@ -135,6 +142,9 @@ export const QuickActionIcon: React.FC<QuickActionIconProps> = ({
     getQuickIconDisabled().then((v) => {
       if (alive) setUserDisabled(v);
     });
+    getQuickIconColorPreset().then((v) => {
+      if (alive) setColorPreset(v);
+    });
     return () => {
       alive = false;
     };
@@ -169,9 +179,18 @@ export const QuickActionIcon: React.FC<QuickActionIconProps> = ({
         setMenuOpen(false);
       },
     );
+    const colorSub = DeviceEventEmitter.addListener(
+      'yaverFeedback:quickIconColorChange',
+      (next: { preset?: keyof typeof QUICK_ICON_COLOR_PRESETS | null }) => {
+        const preset = next?.preset ?? null;
+        setColorPreset(preset);
+        void setQuickIconColorPreset(preset);
+      },
+    );
     return () => {
       showSub.remove();
       hideSub.remove();
+      colorSub.remove();
     };
   }, []);
 
@@ -229,6 +248,7 @@ export const QuickActionIcon: React.FC<QuickActionIconProps> = ({
   if (mode === 'after-shake' && !shakenThisSession) return null;
   if (!YaverFeedback.isEnabled()) return null;
 
+  const presetColors = colorPreset ? QUICK_ICON_COLOR_PRESETS[colorPreset] : null;
   const visualSize = size;
   const radius = visualSize / 2;
 
@@ -271,9 +291,9 @@ export const QuickActionIcon: React.FC<QuickActionIconProps> = ({
               width: visualSize,
               height: visualSize,
               borderRadius: radius,
-              backgroundColor,
-              borderColor,
-              shadowColor,
+              backgroundColor: presetColors?.backgroundColor ?? backgroundColor,
+              borderColor: presetColors?.borderColor ?? borderColor,
+              shadowColor: presetColors?.shadowColor ?? shadowColor,
               opacity: pressed ? 0.85 : 1,
             },
           ]}
@@ -282,7 +302,7 @@ export const QuickActionIcon: React.FC<QuickActionIconProps> = ({
             style={[
               styles.iconLabel,
               {
-                color: foregroundColor,
+                color: presetColors?.foregroundColor ?? foregroundColor,
                 fontSize: Math.round(visualSize * 0.5),
               },
             ]}

package/src/YaverFeedback.ts

@@ -9,13 +9,17 @@ import {
   setStrictNativeAuth,
   getToken,
   getSelectedDeviceId,
+  listReachableDevices,
   clearToken,
   clearSelectedDeviceId,
   DEFAULT_CONVEX_SITE_URL,
 } from './auth';
 import {
   getQuickIconDisabled,
+  getQuickIconColorPreset,
   setQuickIconDisabled,
+  setQuickIconColorPreset,
+  QuickIconColorPreset,
 } from './preferences';
 
 // Is this JS runtime the Yaver mobile app's super-host bridge? The
@@ -362,6 +366,15 @@ export class YaverFeedback {
     await YaverFeedback.discoverAgent();
   }
 
+  /** Resolve the currently selected remote machine from the authenticated device list. */
+  static async getSelectedRemoteDevice() {
+    if (!config?.authToken || !config.preferredDeviceId) return null;
+    const preferredDeviceId = config.preferredDeviceId;
+    const devices = await listReachableDevices(config.authToken);
+    const all = [...devices.owned, ...devices.shared];
+    return all.find((device) => device.deviceId === preferredDeviceId) ?? null;
+  }
+
   /**
    * Sign out: clear cached token + device, tear down the P2P client. The
    * SDK stays enabled; the next feedback trigger will re-prompt for login.
@@ -859,6 +872,22 @@ export class YaverFeedback {
     return getQuickIconDisabled();
   }
 
+  static async setQuickIconColorPreset(
+    preset: QuickIconColorPreset | null,
+  ): Promise<void> {
+    await setQuickIconColorPreset(preset);
+    try {
+      const { DeviceEventEmitter } = require('react-native');
+      DeviceEventEmitter.emit('yaverFeedback:quickIconColorChange', { preset });
+    } catch {
+      // emitter unavailable — preference is still persisted
+    }
+  }
+
+  static async getQuickIconColorPreset(): Promise<QuickIconColorPreset | null> {
+    return getQuickIconColorPreset();
+  }
+
   /** Clear the persisted "user hid the icon" flag. */
   static async resetQuickIconPreference(): Promise<void> {
     await YaverFeedback.setQuickIconVisible(true);

package/src/__tests__/P2PClient.test.ts

@@ -215,4 +215,44 @@ describe('P2PClient', () => {
       expect(result).toEqual(builds);
     });
   });
+
+  describe('reloadApp()', () => {
+    it('returns an acknowledgement for dev reloads', async () => {
+      mockFetch.mockResolvedValue({
+        ok: true,
+        json: () => Promise.resolve({ ok: true, changeClass: 'js_only' }),
+      });
+
+      const client = new P2PClient('http://localhost:18080', 'tok');
+      const result = await client.reloadApp('dev');
+
+      expect(result).toEqual(
+        expect.objectContaining({
+          ok: true,
+          mode: 'dev',
+          acknowledged: true,
+          message: 'Hot reload request accepted.',
+        }),
+      );
+    });
+
+    it('returns an acknowledgement for bundle reloads', async () => {
+      mockFetch.mockResolvedValue({
+        ok: true,
+        json: () => Promise.resolve({ ok: true }),
+      });
+
+      const client = new P2PClient('http://localhost:18080', 'tok');
+      const result = await client.reloadApp('bundle');
+
+      expect(result).toEqual(
+        expect.objectContaining({
+          ok: true,
+          mode: 'bundle',
+          acknowledged: true,
+          message: 'Reload request acknowledged. Agent is rebuilding the bundle.',
+        }),
+      );
+    });
+  });
 });

package/src/__tests__/YaverFeedback.test.ts

@@ -17,6 +17,34 @@ jest.mock('../Discovery', () => ({
   },
 }));
 
+jest.mock('../auth', () => ({
+  configureAuthEndpoints: jest.fn(),
+  setStrictNativeAuth: jest.fn(),
+  getToken: jest.fn(async () => null),
+  getSelectedDeviceId: jest.fn(async () => null),
+  clearToken: jest.fn(async () => {}),
+  clearSelectedDeviceId: jest.fn(async () => {}),
+  listReachableDevices: jest.fn(async () => ({
+    owned: [
+      {
+        deviceId: 'device-1',
+        name: 'Dev Mac',
+        platform: 'darwin',
+        isOnline: true,
+        needsAuth: false,
+        runnerDown: false,
+        lastHeartbeat: Date.now(),
+        isGuest: false,
+        accessScope: 'owner',
+        quicHost: '127.0.0.1',
+        quicPort: 18080,
+      },
+    ],
+    shared: [],
+  })),
+  DEFAULT_CONVEX_SITE_URL: 'https://example.convex.site',
+}));
+
 // Reset module-level state between tests by re-requiring
 beforeEach(() => {
   // YaverFeedback uses module-level variables (config, enabled, p2pClient).
@@ -126,6 +154,20 @@ describe('YaverFeedback', () => {
     });
   });
 
+  describe('getSelectedRemoteDevice()', () => {
+    it('returns the selected device from the reachable device list', async () => {
+      YaverFeedback.init({
+        authToken: 'tok',
+        preferredDeviceId: 'device-1',
+        enabled: true,
+      });
+
+      const device = await YaverFeedback.getSelectedRemoteDevice();
+      expect(device?.deviceId).toBe('device-1');
+      expect(device?.name).toBe('Dev Mac');
+    });
+  });
+
   describe('startReport()', () => {
     it('does nothing when not enabled', async () => {
       YaverFeedback.init({ authToken: 'tok', enabled: false });

package/src/index.ts

@@ -1,12 +1,11 @@
 /**
  * yaver-feedback-react-native — Visual feedback SDK for Yaver.
  *
- * Shake-to-report surface with four core actions:
+ * Shake-to-report surface with three launch actions:
  *  1. Hot Reload              — instant JS reload
  *  2. Vibing                  — open a vibing session on the agent
- *  3. Screenshot / Upload     — capture the screen under the modal or
- *                               upload existing media
- *  4. Screen Recording        — start, then stop + upload
+ *  3. Screenshot & Fix        — capture the current screen and trigger
+ *                               the fix loop
  *
  * The small quick-access icon stays hidden until the first shake by
  * default on mobile, then remains available unless the user hides it.

package/src/preferences.ts

@@ -25,6 +25,69 @@ try {
 }
 
 const QUICK_ICON_DISABLED_KEY = 'yaver_feedback_quickicon_disabled';
+const QUICK_ICON_COLOR_KEY = 'yaver_feedback_quickicon_color';
+
+export type QuickIconColorPreset =
+  | 'orange'
+  | 'lime'
+  | 'cyan'
+  | 'pink'
+  | 'yellow'
+  | 'slate';
+
+export const QUICK_ICON_COLOR_PRESETS: Record<
+  QuickIconColorPreset,
+  {
+    label: string;
+    backgroundColor: string;
+    foregroundColor: string;
+    borderColor: string;
+    shadowColor: string;
+  }
+> = {
+  orange: {
+    label: 'Orange',
+    backgroundColor: '#ff6b2c',
+    foregroundColor: '#111111',
+    borderColor: 'rgba(255,255,255,0.92)',
+    shadowColor: '#000000',
+  },
+  lime: {
+    label: 'Lime',
+    backgroundColor: '#a3e635',
+    foregroundColor: '#111111',
+    borderColor: 'rgba(255,255,255,0.85)',
+    shadowColor: '#365314',
+  },
+  cyan: {
+    label: 'Cyan',
+    backgroundColor: '#22d3ee',
+    foregroundColor: '#082f49',
+    borderColor: 'rgba(255,255,255,0.82)',
+    shadowColor: '#083344',
+  },
+  pink: {
+    label: 'Pink',
+    backgroundColor: '#fb7185',
+    foregroundColor: '#fff1f2',
+    borderColor: 'rgba(255,255,255,0.78)',
+    shadowColor: '#4c0519',
+  },
+  yellow: {
+    label: 'Yellow',
+    backgroundColor: '#facc15',
+    foregroundColor: '#1c1917',
+    borderColor: 'rgba(255,255,255,0.88)',
+    shadowColor: '#713f12',
+  },
+  slate: {
+    label: 'Slate',
+    backgroundColor: '#475569',
+    foregroundColor: '#f8fafc',
+    borderColor: 'rgba(255,255,255,0.68)',
+    shadowColor: '#020617',
+  },
+};
 
 /** True if the user has long-pressed the icon and chosen "Hide". */
 export async function getQuickIconDisabled(): Promise<boolean> {
@@ -53,3 +116,36 @@ export async function setQuickIconDisabled(disabled: boolean): Promise<void> {
 export async function clearQuickIconDisabled(): Promise<void> {
   await setQuickIconDisabled(false);
 }
+
+export async function getQuickIconColorPreset(): Promise<QuickIconColorPreset | null> {
+  if (!AsyncStorage) return null;
+  try {
+    const v = await AsyncStorage.getItem(QUICK_ICON_COLOR_KEY);
+    if (!v) return null;
+    if (Object.prototype.hasOwnProperty.call(QUICK_ICON_COLOR_PRESETS, v)) {
+      return v as QuickIconColorPreset;
+    }
+    return null;
+  } catch {
+    return null;
+  }
+}
+
+export async function setQuickIconColorPreset(
+  preset: QuickIconColorPreset | null,
+): Promise<void> {
+  if (!AsyncStorage) return;
+  try {
+    if (!preset) {
+      await AsyncStorage.removeItem(QUICK_ICON_COLOR_KEY);
+      return;
+    }
+    await AsyncStorage.setItem(QUICK_ICON_COLOR_KEY, preset);
+  } catch {
+    // best-effort
+  }
+}
+
+export async function clearQuickIconColorPreset(): Promise<void> {
+  await setQuickIconColorPreset(null);
+}