prettier-fix, add contribution guidelines

Author: pulkitsharma07

CONTRIBUTING.md

@@ -12,8 +12,8 @@ Thanks for your interest in contributing! This guide explains how to get involve
 ## Development Process & Pull Requests
 
 1. Create a new branch for your changes
-2. Make your changes following existing code style and conventions
-3. Test changes locally
+2. Make your changes following existing code style and conventions. You can run `npm run prettier-check` and `npm run prettier-fix` as applicable.
+3. Test changes locally by running `npm test`
 4. Update documentation as needed
 5. Use clear commit messages explaining your changes
 6. Verify all changes work as expected

client/src/components/__tests__/Sidebar.test.tsx

@@ -321,7 +321,9 @@ describe("Sidebar Environment Variables", () => {
 
       openConfigSection();
 
-      const timeoutInput = screen.getByTestId("MCP_SERVER_REQUEST_TIMEOUT-input");
+      const timeoutInput = screen.getByTestId(
+        "MCP_SERVER_REQUEST_TIMEOUT-input",
+      );
       fireEvent.change(timeoutInput, { target: { value: "5000" } });
 
       expect(setConfig).toHaveBeenCalledWith({
@@ -338,7 +340,9 @@ describe("Sidebar Environment Variables", () => {
 
       openConfigSection();
 
-      const timeoutInput = screen.getByTestId("MCP_SERVER_REQUEST_TIMEOUT-input");
+      const timeoutInput = screen.getByTestId(
+        "MCP_SERVER_REQUEST_TIMEOUT-input",
+      );
       fireEvent.change(timeoutInput, { target: { value: "abc1" } });
 
       expect(setConfig).toHaveBeenCalledWith({
@@ -351,22 +355,35 @@ describe("Sidebar Environment Variables", () => {
 
     it("should maintain configuration state after multiple updates", () => {
       const setConfig = jest.fn();
-      const { rerender } = renderSidebar({ config: DEFAULT_INSPECTOR_CONFIG, setConfig });
+      const { rerender } = renderSidebar({
+        config: DEFAULT_INSPECTOR_CONFIG,
+        setConfig,
+      });
 
       openConfigSection();
 
       // First update
-      const timeoutInput = screen.getByTestId("MCP_SERVER_REQUEST_TIMEOUT-input");
+      const timeoutInput = screen.getByTestId(
+        "MCP_SERVER_REQUEST_TIMEOUT-input",
+      );
       fireEvent.change(timeoutInput, { target: { value: "5000" } });
 
       // Get the updated config from the first setConfig call
       const updatedConfig = setConfig.mock.calls[0][0] as InspectorConfig;
 
       // Rerender with the updated config
-      rerender(<Sidebar {...defaultProps} config={updatedConfig} setConfig={setConfig} />);
+      rerender(
+        <Sidebar
+          {...defaultProps}
+          config={updatedConfig}
+          setConfig={setConfig}
+        />,
+      );
 
       // Second update
-      const updatedTimeoutInput = screen.getByTestId("MCP_SERVER_REQUEST_TIMEOUT-input");
+      const updatedTimeoutInput = screen.getByTestId(
+        "MCP_SERVER_REQUEST_TIMEOUT-input",
+      );
       fireEvent.change(updatedTimeoutInput, { target: { value: "3000" } });
 
       // Verify the final state matches what we expect

package.json

@@ -23,7 +23,7 @@
   "scripts": {
     "dev": "concurrently \"cd client && npm run dev\" \"cd server && npm run dev\"",
     "dev:windows": "concurrently \"cd client && npm run dev\" \"cd server && npm run dev:windows",
-    "test": "cd client && npm test",
+    "test": "npm run prettier-check && cd client && npm test",
     "build-server": "cd server && npm run build",
     "build-client": "cd client && npm run build",
     "build": "npm run build-server && npm run build-client",
@@ -32,6 +32,7 @@
     "start": "node ./bin/cli.js",
     "prepare": "npm run build",
     "prettier-fix": "prettier --write .",
+    "prettier-check": "prettier --check .",
     "publish-all": "npm publish --workspaces --access public && npm publish --access public"
   },
   "dependencies": {