@@ -144,40 +144,40 @@ describe("McpToolRow", () => {
144144 expect ( screen . getByText ( "Second parameter" ) ) . toBeInTheDocument ( )
145145 } )
146146
147- it ( "shows eye button when serverName is provided and not in chat context" , ( ) => {
147+ it ( "shows toggle switch when serverName is provided and not in chat context" , ( ) => {
148148 render ( < McpToolRow tool = { mockTool } serverName = "test-server" /> )
149149
150- const eyeButton = screen . getByRole ( "button " , { name : "Toggle prompt inclusion" } )
151- expect ( eyeButton ) . toBeInTheDocument ( )
150+ const toggleSwitch = screen . getByRole ( "switch " , { name : "Toggle prompt inclusion" } )
151+ expect ( toggleSwitch ) . toBeInTheDocument ( )
152152 } )
153153
154- it ( "hides eye button when isInChatContext is true" , ( ) => {
154+ it ( "hides toggle switch when isInChatContext is true" , ( ) => {
155155 render ( < McpToolRow tool = { mockTool } serverName = "test-server" isInChatContext = { true } /> )
156156
157- const eyeButton = screen . queryByRole ( "button " , { name : "Toggle prompt inclusion" } )
158- expect ( eyeButton ) . not . toBeInTheDocument ( )
157+ const toggleSwitch = screen . queryByRole ( "switch " , { name : "Toggle prompt inclusion" } )
158+ expect ( toggleSwitch ) . not . toBeInTheDocument ( )
159159 } )
160160
161- it ( "shows correct eye icon based on enabledForPrompt state " , ( ) => {
162- // Test when enabled (should show eye-closed icon )
161+ it ( "shows correct toggle switch state based on enabledForPrompt" , ( ) => {
162+ // Test when enabled (should be checked )
163163 const { rerender } = render ( < McpToolRow tool = { mockTool } serverName = "test-server" /> )
164164
165- let eyeIcon = screen . getByRole ( "button " , { name : "Toggle prompt inclusion" } ) . querySelector ( "span" )
166- expect ( eyeIcon ) . toHaveClass ( "codicon-eye-closed ")
165+ let toggleSwitch = screen . getByRole ( "switch " , { name : "Toggle prompt inclusion" } )
166+ expect ( toggleSwitch ) . toHaveAttribute ( "aria-checked" , "true ")
167167
168- // Test when disabled (should show eye icon )
168+ // Test when disabled (should not be checked )
169169 const disabledTool = { ...mockTool , enabledForPrompt : false }
170170 rerender ( < McpToolRow tool = { disabledTool } serverName = "test-server" /> )
171171
172- eyeIcon = screen . getByRole ( "button " , { name : "Toggle prompt inclusion" } ) . querySelector ( "span" )
173- expect ( eyeIcon ) . toHaveClass ( "codicon-eye ")
172+ toggleSwitch = screen . getByRole ( "switch " , { name : "Toggle prompt inclusion" } )
173+ expect ( toggleSwitch ) . toHaveAttribute ( "aria-checked" , "false ")
174174 } )
175175
176- it ( "sends message to toggle enabledForPrompt when eye button is clicked" , ( ) => {
176+ it ( "sends message to toggle enabledForPrompt when toggle switch is clicked" , ( ) => {
177177 render ( < McpToolRow tool = { mockTool } serverName = "test-server" /> )
178178
179- const eyeButton = screen . getByRole ( "button " , { name : "Toggle prompt inclusion" } )
180- fireEvent . click ( eyeButton )
179+ const toggleSwitch = screen . getByRole ( "switch " , { name : "Toggle prompt inclusion" } )
180+ fireEvent . click ( toggleSwitch )
181181
182182 expect ( vscode . postMessage ) . toHaveBeenCalledWith ( {
183183 type : "toggleToolEnabledForPrompt" ,
@@ -187,4 +187,102 @@ describe("McpToolRow", () => {
187187 isEnabled : false ,
188188 } )
189189 } )
190+
191+ it ( "hides always allow checkbox when tool is disabled" , ( ) => {
192+ const disabledTool = { ...mockTool , enabledForPrompt : false }
193+ render ( < McpToolRow tool = { disabledTool } serverName = "test-server" alwaysAllowMcp = { true } /> )
194+
195+ expect ( screen . queryByText ( "Always allow" ) ) . not . toBeInTheDocument ( )
196+ } )
197+
198+ it ( "shows always allow checkbox when tool is enabled" , ( ) => {
199+ const enabledTool = { ...mockTool , enabledForPrompt : true }
200+ render ( < McpToolRow tool = { enabledTool } serverName = "test-server" alwaysAllowMcp = { true } /> )
201+
202+ expect ( screen . getByText ( "Always allow" ) ) . toBeInTheDocument ( )
203+ } )
204+
205+ it ( "hides parameters section when tool is disabled" , ( ) => {
206+ const disabledToolWithSchema = {
207+ ...mockTool ,
208+ enabledForPrompt : false ,
209+ inputSchema : {
210+ type : "object" ,
211+ properties : {
212+ param1 : {
213+ type : "string" ,
214+ description : "First parameter" ,
215+ } ,
216+ } ,
217+ required : [ "param1" ] ,
218+ } ,
219+ }
220+
221+ render ( < McpToolRow tool = { disabledToolWithSchema } serverName = "test-server" /> )
222+
223+ expect ( screen . queryByText ( "Parameters" ) ) . not . toBeInTheDocument ( )
224+ expect ( screen . queryByText ( "param1" ) ) . not . toBeInTheDocument ( )
225+ expect ( screen . queryByText ( "First parameter" ) ) . not . toBeInTheDocument ( )
226+ } )
227+
228+ it ( "shows parameters section when tool is enabled" , ( ) => {
229+ const enabledToolWithSchema = {
230+ ...mockTool ,
231+ enabledForPrompt : true ,
232+ inputSchema : {
233+ type : "object" ,
234+ properties : {
235+ param1 : {
236+ type : "string" ,
237+ description : "First parameter" ,
238+ } ,
239+ } ,
240+ required : [ "param1" ] ,
241+ } ,
242+ }
243+
244+ render ( < McpToolRow tool = { enabledToolWithSchema } serverName = "test-server" /> )
245+
246+ expect ( screen . getByText ( "Parameters" ) ) . toBeInTheDocument ( )
247+ expect ( screen . getByText ( "param1" ) ) . toBeInTheDocument ( )
248+ expect ( screen . getByText ( "First parameter" ) ) . toBeInTheDocument ( )
249+ } )
250+
251+ it ( "grays out tool name and description when tool is disabled" , ( ) => {
252+ const disabledTool = {
253+ ...mockTool ,
254+ enabledForPrompt : false ,
255+ description : "A disabled tool" ,
256+ }
257+ render ( < McpToolRow tool = { disabledTool } serverName = "test-server" /> )
258+
259+ const toolName = screen . getByText ( "test-tool" )
260+ const toolDescription = screen . getByText ( "A disabled tool" )
261+
262+ // Check that the tool name has the grayed out classes
263+ expect ( toolName ) . toHaveClass ( "text-vscode-descriptionForeground" , "opacity-60" )
264+
265+ // Check that the description has reduced opacity
266+ expect ( toolDescription ) . toHaveClass ( "opacity-40" )
267+ } )
268+
269+ it ( "shows normal styling for tool name and description when tool is enabled" , ( ) => {
270+ const enabledTool = {
271+ ...mockTool ,
272+ enabledForPrompt : true ,
273+ description : "An enabled tool" ,
274+ }
275+ render ( < McpToolRow tool = { enabledTool } serverName = "test-server" /> )
276+
277+ const toolName = screen . getByText ( "test-tool" )
278+ const toolDescription = screen . getByText ( "An enabled tool" )
279+
280+ // Check that the tool name has normal styling
281+ expect ( toolName ) . toHaveClass ( "text-vscode-foreground" )
282+ expect ( toolName ) . not . toHaveClass ( "text-vscode-descriptionForeground" , "opacity-60" )
283+
284+ // Check that the description has normal opacity
285+ expect ( toolDescription ) . toHaveClass ( "opacity-80" )
286+ expect ( toolDescription ) . not . toHaveClass ( "opacity-40" )
287+ } )
190288} )
0 commit comments