1- import React , { useRef } from "react" ;
1+ import React , { useRef , useMemo } from "react" ;
22import type { Meta , StoryObj } from "@storybook/react-vite" ;
33import { ReviewPanel } from "./ReviewPanel" ;
44import { deleteWorkspaceStorage } from "@/common/constants/storage" ;
5- import type { BashToolResult } from "@/common/types/tools " ;
6- import type { Result } from "@/common/types/result " ;
5+ import { ORPCProvider } from "@/browser/orpc/react " ;
6+ import { createMockORPCClient } from "@/../.storybook/mocks/orpc " ;
77
88type ScenarioName = "rich" | "empty" | "truncated" ;
99
@@ -352,40 +352,33 @@ const scenarioConfigs: Record<ScenarioName, ScenarioConfig> = {
352352 } ,
353353} ;
354354
355- function createSuccessResult (
356- output : string ,
357- overrides ?: { truncated ?: { reason : string ; totalLines : number } }
358- ) : Result < BashToolResult , string > {
359- return {
360- success : true as const ,
361- data : {
362- success : true as const ,
363- output,
364- exitCode : 0 ,
365- wall_duration_ms : 5 ,
366- ...overrides ,
367- } ,
368- } ;
369- }
370-
371- type MockApi = WindowApi & {
372- workspace : {
373- executeBash : ( workspaceId : string , command : string ) => Promise < Result < BashToolResult , string > > ;
374- } ;
375- } ;
376-
377- function setupCodeReviewMocks ( config : ScenarioConfig ) {
378- const executeBash : MockApi [ "workspace" ] [ "executeBash" ] = ( _workspaceId , command ) => {
355+ function createExecuteBashMock ( config : ScenarioConfig ) {
356+ return ( _workspaceId : string , command : string ) => {
379357 if ( command . includes ( "git ls-files --others --exclude-standard" ) ) {
380- return Promise . resolve ( createSuccessResult ( config . untrackedFiles . join ( "\n" ) ) ) ;
358+ return Promise . resolve ( {
359+ success : true as const ,
360+ output : config . untrackedFiles . join ( "\n" ) ,
361+ exitCode : 0 as const ,
362+ wall_duration_ms : 5 ,
363+ } ) ;
381364 }
382365
383366 if ( command . includes ( "--numstat" ) ) {
384- return Promise . resolve ( createSuccessResult ( config . numstatOutput ) ) ;
367+ return Promise . resolve ( {
368+ success : true as const ,
369+ output : config . numstatOutput ,
370+ exitCode : 0 as const ,
371+ wall_duration_ms : 5 ,
372+ } ) ;
385373 }
386374
387375 if ( command . includes ( "git add --" ) ) {
388- return Promise . resolve ( createSuccessResult ( "" ) ) ;
376+ return Promise . resolve ( {
377+ success : true as const ,
378+ output : "" ,
379+ exitCode : 0 as const ,
380+ wall_duration_ms : 5 ,
381+ } ) ;
389382 }
390383
391384 if ( command . startsWith ( "git diff" ) || command . includes ( "git diff " ) ) {
@@ -396,28 +389,25 @@ function setupCodeReviewMocks(config: ScenarioConfig) {
396389 ? ( config . diffByFile [ pathFilter ] ?? "" )
397390 : Object . values ( config . diffByFile ) . filter ( Boolean ) . join ( "\n\n" ) ;
398391
399- const truncated =
400- ! pathFilter && config . truncated ? { truncated : config . truncated } : undefined ;
401- return Promise . resolve ( createSuccessResult ( diffOutput , truncated ) ) ;
392+ return Promise . resolve ( {
393+ success : true as const ,
394+ output : diffOutput ,
395+ exitCode : 0 as const ,
396+ wall_duration_ms : 5 ,
397+ ...( ! pathFilter && config . truncated ? { truncated : config . truncated } : { } ) ,
398+ } ) ;
402399 }
403400
404- return Promise . resolve ( createSuccessResult ( "" ) ) ;
405- } ;
406-
407- const mockApi : MockApi = {
408- workspace : {
409- executeBash,
410- } ,
411- platform : "browser" ,
412- versions : {
413- node : "18.18.0" ,
414- chrome : "120.0.0.0" ,
415- electron : "28.0.0" ,
416- } ,
401+ return Promise . resolve ( {
402+ success : true as const ,
403+ output : "" ,
404+ exitCode : 0 as const ,
405+ wall_duration_ms : 5 ,
406+ } ) ;
417407 } ;
408+ }
418409
419- window . api = mockApi ;
420-
410+ function setupLocalStorage ( config : ScenarioConfig ) {
421411 deleteWorkspaceStorage ( config . workspaceId ) ;
422412 localStorage . removeItem ( `review-diff-base:${ config . workspaceId } ` ) ;
423413 localStorage . removeItem ( `review-file-filter:${ config . workspaceId } ` ) ;
@@ -430,23 +420,34 @@ const ReviewPanelStoryWrapper: React.FC<{ scenario: ScenarioName }> = ({ scenari
430420 const initialized = useRef ( false ) ;
431421 const config = scenarioConfigs [ scenario ] ;
432422
423+ // Create mock ORPC client with the scenario-specific executeBash mock
424+ const client = useMemo (
425+ ( ) =>
426+ createMockORPCClient ( {
427+ executeBash : createExecuteBashMock ( config ) ,
428+ } ) ,
429+ [ config ]
430+ ) ;
431+
433432 if ( ! initialized . current ) {
434- setupCodeReviewMocks ( config ) ;
433+ setupLocalStorage ( config ) ;
435434 initialized . current = true ;
436435 }
437436
438437 return (
439- < div
440- style = { {
441- height : "720px" ,
442- width : "520px" ,
443- padding : "16px" ,
444- background : "#050505" ,
445- boxSizing : "border-box" ,
446- } }
447- >
448- < ReviewPanel workspaceId = { config . workspaceId } workspacePath = { config . workspacePath } />
449- </ div >
438+ < ORPCProvider client = { client } >
439+ < div
440+ style = { {
441+ height : "720px" ,
442+ width : "520px" ,
443+ padding : "16px" ,
444+ background : "#050505" ,
445+ boxSizing : "border-box" ,
446+ } }
447+ >
448+ < ReviewPanel workspaceId = { config . workspaceId } workspacePath = { config . workspacePath } />
449+ </ div >
450+ </ ORPCProvider >
450451 ) ;
451452} ;
452453
0 commit comments