diff --git a/webviews/src/App.tsx b/webviews/src/App.tsx
index b18a0b7..bb2cb66 100644
--- a/webviews/src/App.tsx
+++ b/webviews/src/App.tsx
@@ -217,7 +217,7 @@ function App() {
case ServerStatus.installing:
return "installing";
case ServerStatus.stopped:
- return "partial";
+ return "stopped";
case ServerStatus.started:
return "complete";
case ServerStatus.missing:
diff --git a/webviews/src/StatusCheck.test.tsx b/webviews/src/StatusCheck.test.tsx
index 9709b0d..86487ea 100644
--- a/webviews/src/StatusCheck.test.tsx
+++ b/webviews/src/StatusCheck.test.tsx
@@ -28,21 +28,27 @@ jest.mock('react-icons/vsc', () => ({
PassFilled
+ )),
+ VscStopCircle: jest.fn(props => (
+
+ StopCircle
+
))
}));
// Import the mocked modules
-const {
- VscArrowCircleDown,
- VscCircleLarge,
- VscCircleLargeFilled,
- VscPass,
- VscPassFilled
+const {
+ VscArrowCircleDown,
+ VscCircleLarge,
+ VscCircleLargeFilled,
+ VscPass,
+ VscPassFilled,
+ VscStopCircle
} = jest.requireMock('react-icons/vsc');
describe('StatusCheck Component', () => {
const defaultColor = "var(--vscode-textLink-foreground)";
-
+ const errorColor = "var(--vscode-errorForeground)";
beforeEach(() => {
// Clear mock calls before each test
jest.clearAllMocks();
@@ -84,6 +90,15 @@ describe('StatusCheck Component', () => {
);
});
+ it('renders stopped type with Stop icon', () => {
+ const { getByTestId } = render();
+ expect(getByTestId('vsc-stop-circle')).toBeInTheDocument();
+ expect(VscStopCircle).toHaveBeenCalledWith(
+ expect.objectContaining({ color: errorColor }),
+ expect.any(Object)
+ );
+ });
+
it('renders missing type with CircleLarge icon', () => {
const { getByTestId } = render();
expect(getByTestId('vsc-circle-large')).toBeInTheDocument();
@@ -104,13 +119,14 @@ describe('StatusCheck Component', () => {
});
it('handles all possible status values', () => {
- const statusValues: (StatusValue | null)[] = [null, 'complete', 'installing', 'partial', 'missing'];
+ const statusValues: (StatusValue | null)[] = [null, 'complete', 'installing', 'partial', 'missing', 'stopped'];
const testIds = {
null: 'vsc-circle-large-filled',
complete: 'vsc-pass-filled',
installing: 'vsc-arrow-circle-down',
partial: 'vsc-pass',
- missing: 'vsc-circle-large'
+ missing: 'vsc-circle-large',
+ stopped: 'vsc-stop-circle'
};
statusValues.forEach(status => {
diff --git a/webviews/src/StatusCheck.tsx b/webviews/src/StatusCheck.tsx
index c7a94d7..05536a8 100644
--- a/webviews/src/StatusCheck.tsx
+++ b/webviews/src/StatusCheck.tsx
@@ -1,7 +1,7 @@
-import { VscArrowCircleDown, VscCircleLarge, VscCircleLargeFilled, VscPass, VscPassFilled } from "react-icons/vsc";
+import { VscArrowCircleDown, VscCircleLarge, VscCircleLargeFilled, VscPass, VscPassFilled, VscStopCircle } from "react-icons/vsc";
-export type StatusValue = 'complete' | 'installing' | 'partial' | 'missing';
+export type StatusValue = 'complete' | 'installing' | 'partial' | 'missing' | 'stopped';
export interface StatusCheckProps {
type: StatusValue | null;
@@ -9,6 +9,7 @@ export interface StatusCheckProps {
}
const DEFAULT_COLOR = "var(--vscode-textLink-foreground)";
+const ERROR_COLOR = "var(--vscode-errorForeground)";
export const StatusCheck: React.FC = ({ type, title }: StatusCheckProps) => {
switch (type) {
@@ -20,6 +21,8 @@ export const StatusCheck: React.FC = ({ type, title }: StatusC
return ;
case "partial":
return ;
+ case "stopped":
+ return
default: //"missing"
return ;
}