Use 'stop' icon when Ollama is stopped

Signed-off-by: Fred Bricon <fbricon@gmail.com>
redhat-developer · Jan 9, 2025 · 5801c3d · 5801c3d
1 parent 3bd686a
commit 5801c3d
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 11 deletions.
diff --git 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
@@ -28,16 +28,22 @@ jest.mock('react-icons/vsc', () => ({
     <div data-testid="vsc-pass-filled" title={props.title}>
       PassFilled
     </div>
+  )),
+  VscStopCircle: jest.fn(props => (
+    <div data-testid="vsc-stop-circle" title={props.title}>
+      StopCircle
+    </div>
   ))
 }));
 
 // 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', () => {
@@ -84,6 +90,15 @@ describe('StatusCheck Component', () => {
     );
   });
 
+  it('renders stopped type with Stop icon', () => {
+    const { getByTestId } = render(<StatusCheck type="stopped" />);
+    expect(getByTestId('vsc-stop-circle')).toBeInTheDocument();
+    expect(VscStopCircle).toHaveBeenCalledWith(
+      expect.objectContaining({ color: defaultColor }),
+      expect.any(Object)
+    );
+  });
+
   it('renders missing type with CircleLarge icon', () => {
     const { getByTestId } = render(<StatusCheck type="missing" />);
     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
@@ -1,14 +1,15 @@
-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;
   title?: string;
 }
 
 const DEFAULT_COLOR = "var(--vscode-textLink-foreground)";
+const ERROR_COLOR = "var(--vscode-errorForeground)";
 
 export const StatusCheck: React.FC<StatusCheckProps> = ({ type, title }: StatusCheckProps) => {
   switch (type) {
@@ -20,6 +21,8 @@ export const StatusCheck: React.FC<StatusCheckProps> = ({ type, title }: StatusC
       return <VscArrowCircleDown color={DEFAULT_COLOR} title={title} />;
     case "partial":
       return <VscPass color={DEFAULT_COLOR} title={title} />;
+    case "stopped":
+      return <VscStopCircle color={ERROR_COLOR} title={title} />
     default: //"missing"
       return <VscCircleLarge title={title} />;
   }