From 45dd69ea9653e35f8470241277fb8d1eae041c59 Mon Sep 17 00:00:00 2001
From: Kesava Krishnan Madavan <mkesavan13@gmail.com>
Date: Wed, 19 Nov 2025 08:16:02 +0530
Subject: [PATCH 1/2] fix(station-login): visibility toggle for desktop login

---
 .../components/StationLogin/station-login.tsx |  8 +-
 .../StationLogin/station-login.types.ts       |  8 ++
 .../components/StationLogin/station-login.tsx | 91 +++++++++++++++++++
 .../station-login/src/station-login/index.tsx |  3 +-
 .../src/station-login/station-login.types.ts  |  9 +-
 playwright/Utils/stationLoginUtils.ts         | 28 ++++++
 playwright/tests/station-login-test.spec.ts   | 43 ++++++++-
 .../cc/samples-cc-react-app/src/App.tsx       | 61 ++++++++++---
 8 files changed, 235 insertions(+), 16 deletions(-)

diff --git a/packages/contact-center/cc-components/src/components/StationLogin/station-login.tsx b/packages/contact-center/cc-components/src/components/StationLogin/station-login.tsx
index 5d61f896f..ec38232ba 100644
--- a/packages/contact-center/cc-components/src/components/StationLogin/station-login.tsx
+++ b/packages/contact-center/cc-components/src/components/StationLogin/station-login.tsx
@@ -48,6 +48,7 @@ const StationLoginComponent: React.FunctionComponent<StationLoginComponentProps>
     selectedDeviceType,
     dialNumberValue,
     setSelectedTeamId,
+    hideDesktopLogin,
   } = props;
 
   const [dialNumberLabel, setDialNumberLabel] = useState<string>('');
@@ -59,6 +60,9 @@ const StationLoginComponent: React.FunctionComponent<StationLoginComponentProps>
   const [dnErrorText, setDNErrorText] = useState<string>('');
   const {multiSignInModalRef, ccSignOutModalRef, saveConfirmDialogRef} = createStationLoginRefs(logger);
 
+  // Filter out Desktop mode if hideDesktopLogin is true
+  const filteredLoginOptions = hideDesktopLogin ? loginOptions.filter((option) => option !== DESKTOP) : loginOptions;
+
   useEffect(() => {
     if (deviceType !== DESKTOP && Object.keys(LoginOptions).includes(deviceType)) {
       updateDialNumberLabel(deviceType, setDialNumberLabel, setDialNumberPlaceholder, logger);
@@ -227,8 +231,8 @@ const StationLoginComponent: React.FunctionComponent<StationLoginComponentProps>
                 selectedValueText={LoginOptions[selectedDeviceType]}
               >
                 {Object.keys(LoginOptions).map((option: string, index: number) => {
-                  // only show loginOptions provided by store
-                  if (loginOptions.includes(option)) {
+                  // only show loginOptions provided by store and filtered by hideDesktopLogin
+                  if (filteredLoginOptions.includes(option)) {
                     return (
                       <Option
                         selected={option === selectedDeviceType}
diff --git a/packages/contact-center/cc-components/src/components/StationLogin/station-login.types.ts b/packages/contact-center/cc-components/src/components/StationLogin/station-login.types.ts
index a6c020845..a361dbf2f 100644
--- a/packages/contact-center/cc-components/src/components/StationLogin/station-login.types.ts
+++ b/packages/contact-center/cc-components/src/components/StationLogin/station-login.types.ts
@@ -202,6 +202,13 @@ export interface IStationLoginProps {
    * The selected team ID for login
    */
   selectedTeamId: string;
+
+  /**
+   * If true, hides the Desktop login mode from the dropdown options.
+   * Applies in both login screen and profile mode.
+   * Default: undefined (shows Desktop mode)
+   */
+  hideDesktopLogin?: boolean;
 }
 
 export interface LoginOptionsState {
@@ -243,4 +250,5 @@ export type StationLoginComponentProps = Pick<
   | 'setDialNumberValue'
   | 'setSelectedTeamId'
   | 'selectedTeamId'
+  | 'hideDesktopLogin'
 >;
diff --git a/packages/contact-center/cc-components/tests/components/StationLogin/station-login.tsx b/packages/contact-center/cc-components/tests/components/StationLogin/station-login.tsx
index d4061e2fe..f422c883a 100644
--- a/packages/contact-center/cc-components/tests/components/StationLogin/station-login.tsx
+++ b/packages/contact-center/cc-components/tests/components/StationLogin/station-login.tsx
@@ -427,6 +427,97 @@ describe('Station Login Component', () => {
         }
       });
     });
+
+    it('hides Desktop login option when hideDesktopLogin is true', async () => {
+      const screen = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={true}
+          profileMode={false}
+        />
+      );
+
+      const loginOptionsSelect = screen.getAllByTestId('login-option-select')[0];
+      const loginOptions = loginOptionsSelect.childNodes;
+
+      // Should only render 2 options (AGENT_DN and EXTENSION), Desktop (BROWSER) should be hidden
+      expect(loginOptions.length).toBe(2);
+
+      // Verify Desktop is not in the rendered options
+      const desktopOption = screen.queryByTestId('login-option-Desktop');
+      expect(desktopOption).not.toBeInTheDocument();
+
+      // Verify other options are present
+      expect(screen.getByTestId('login-option-Dial Number')).toBeInTheDocument();
+      expect(screen.getByTestId('login-option-Extension')).toBeInTheDocument();
+    });
+
+    it('shows Desktop login option when hideDesktopLogin is false', async () => {
+      const screen = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={false}
+          profileMode={false}
+        />
+      );
+
+      const loginOptionsSelect = screen.getAllByTestId('login-option-select')[0];
+      const loginOptions = loginOptionsSelect.childNodes;
+
+      // Should render all 3 options including Desktop
+      expect(loginOptions.length).toBe(3);
+
+      // Verify Desktop is in the rendered options
+      expect(screen.getByTestId('login-option-Desktop')).toBeInTheDocument();
+      expect(screen.getByTestId('login-option-Dial Number')).toBeInTheDocument();
+      expect(screen.getByTestId('login-option-Extension')).toBeInTheDocument();
+    });
+
+    it('shows Desktop login option when hideDesktopLogin is undefined', async () => {
+      const screen = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={undefined}
+          profileMode={false}
+        />
+      );
+
+      const loginOptionsSelect = screen.getAllByTestId('login-option-select')[0];
+      const loginOptions = loginOptionsSelect.childNodes;
+
+      // Should render all 3 options including Desktop (default behavior)
+      expect(loginOptions.length).toBe(3);
+
+      // Verify Desktop is in the rendered options
+      expect(screen.getByTestId('login-option-Desktop')).toBeInTheDocument();
+    });
+
+    it('hides Desktop login option in profile mode when hideDesktopLogin is true', async () => {
+      const screen = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={true}
+          profileMode={true}
+          isAgentLoggedIn={true}
+        />
+      );
+
+      const loginOptionsSelect = screen.getAllByTestId('login-option-select')[0];
+      const loginOptions = loginOptionsSelect.childNodes;
+
+      // Should only render 2 options (AGENT_DN and EXTENSION), Desktop (BROWSER) should be hidden even in profile mode
+      expect(loginOptions.length).toBe(2);
+
+      // Verify Desktop is NOT in the rendered options (hideDesktopLogin applies in profile mode too)
+      const desktopOption = screen.queryByTestId('login-option-Desktop');
+      expect(desktopOption).not.toBeInTheDocument();
+      expect(screen.getByTestId('login-option-Dial Number')).toBeInTheDocument();
+      expect(screen.getByTestId('login-option-Extension')).toBeInTheDocument();
+    });
   });
 
   describe('Actions', () => {
diff --git a/packages/contact-center/station-login/src/station-login/index.tsx b/packages/contact-center/station-login/src/station-login/index.tsx
index ef4febfa0..2508e58dd 100644
--- a/packages/contact-center/station-login/src/station-login/index.tsx
+++ b/packages/contact-center/station-login/src/station-login/index.tsx
@@ -8,7 +8,7 @@ import {useStationLogin} from '../helper';
 import {StationLoginProps} from './station-login.types';
 
 const StationLoginInternal: React.FunctionComponent<StationLoginProps> = observer(
-  ({onLogin, onLogout, onCCSignOut, profileMode, onSaveStart, onSaveEnd, doStationLogout}) => {
+  ({onLogin, onLogout, onCCSignOut, profileMode, onSaveStart, onSaveEnd, doStationLogout, hideDesktopLogin}) => {
     const {
       cc,
       teams,
@@ -53,6 +53,7 @@ const StationLoginInternal: React.FunctionComponent<StationLoginProps> = observe
       setTeamId,
       logger,
       profileMode,
+      hideDesktopLogin,
     };
 
     return <StationLoginComponent {...props} />;
diff --git a/packages/contact-center/station-login/src/station-login/station-login.types.ts b/packages/contact-center/station-login/src/station-login/station-login.types.ts
index 582996d5b..8a3fa0956 100644
--- a/packages/contact-center/station-login/src/station-login/station-login.types.ts
+++ b/packages/contact-center/station-login/src/station-login/station-login.types.ts
@@ -20,6 +20,13 @@ export type StationLoginProps = Pick<IStationLoginProps, 'profileMode'> &
   Partial<
     Pick<
       IStationLoginProps,
-      'onLogin' | 'onLogout' | 'onCCSignOut' | 'onSaveStart' | 'onSaveEnd' | 'teamId' | 'doStationLogout'
+      | 'onLogin'
+      | 'onLogout'
+      | 'onCCSignOut'
+      | 'onSaveStart'
+      | 'onSaveEnd'
+      | 'teamId'
+      | 'doStationLogout'
+      | 'hideDesktopLogin'
     >
   >;
diff --git a/playwright/Utils/stationLoginUtils.ts b/playwright/Utils/stationLoginUtils.ts
index 5dee0b800..65c754686 100644
--- a/playwright/Utils/stationLoginUtils.ts
+++ b/playwright/Utils/stationLoginUtils.ts
@@ -227,3 +227,31 @@ export async function ensureUserStateVisible(page: Page, loginMode: string, numb
     await expect(page.getByTestId('state-select')).toBeVisible({timeout: LONG_WAIT});
   }
 }
+
+/**
+ * Verifies if Desktop login option is visible or hidden in the login dropdown
+ * @param page - The Playwright page object
+ * @param shouldBeVisible - Whether Desktop option should be visible (true) or hidden (false)
+ * @throws {Error} When the Desktop option visibility doesn't match expectation
+ * @example
+ * ```typescript
+ * // Verify Desktop is visible
+ * await verifyDesktopOptionVisibility(page, true);
+ *
+ * // Verify Desktop is hidden (when hideDesktopLogin is true)
+ * await verifyDesktopOptionVisibility(page, false);
+ * ```
+ */
+export async function verifyDesktopOptionVisibility(page: Page, shouldBeVisible: boolean): Promise<void> {
+  // Open the dropdown
+  await page.getByTestId('login-option-select').locator('#select-base-triggerid svg').click({timeout: AWAIT_TIMEOUT});
+
+  // Check Desktop option visibility
+  const desktopOption = page.getByTestId('login-option-Desktop');
+
+  if (shouldBeVisible) {
+    await expect(desktopOption).toBeVisible({timeout: AWAIT_TIMEOUT});
+  } else {
+    await expect(desktopOption).not.toBeVisible();
+  }
+}
diff --git a/playwright/tests/station-login-test.spec.ts b/playwright/tests/station-login-test.spec.ts
index cd0212270..86caf56e0 100644
--- a/playwright/tests/station-login-test.spec.ts
+++ b/playwright/tests/station-login-test.spec.ts
@@ -1,6 +1,11 @@
 import {test, expect} from '@playwright/test';
 import {agentRelogin} from '../Utils/initUtils';
-import {telephonyLogin, verifyLoginMode, ensureUserStateVisible} from '../Utils/stationLoginUtils';
+import {
+  telephonyLogin,
+  verifyLoginMode,
+  ensureUserStateVisible,
+  verifyDesktopOptionVisibility,
+} from '../Utils/stationLoginUtils';
 import {changeUserState, verifyCurrentState, getStateElapsedTime} from '../Utils/userStateUtils';
 import {parseTimeString, waitForWebSocketDisconnection, waitForWebSocketReconnection} from '../Utils/helperUtils';
 import {USER_STATES, LOGIN_MODE, LONG_WAIT} from '../constants';
@@ -278,6 +283,42 @@ export default function createStationLoginTests() {
     });
   });
 
+  test.describe('Station Login Tests - hideDesktopLogin Feature', () => {
+    let testManager: TestManager;
+
+    test.beforeAll(async ({browser}, testInfo) => {
+      const projectName = testInfo.project.name;
+      testManager = new TestManager(projectName);
+      await testManager.setupForStationLogin(browser, false);
+    });
+
+    test.afterAll(async () => {
+      if (testManager) {
+        await testManager.cleanup();
+      }
+    });
+
+    test('should toggle Desktop option visibility when hideDesktopLogin checkbox is toggled', async () => {
+      await expect(testManager.agent1Page.getByTestId('station-login-widget')).toBeVisible({timeout: 2000});
+      const hideDesktopCheckbox = testManager.agent1Page.getByTestId('samples:hide-desktop-login-checkbox');
+
+      // Uncheck - Desktop should be visible
+      await hideDesktopCheckbox.click();
+      await testManager.agent1Page.waitForTimeout(500);
+      await verifyDesktopOptionVisibility(testManager.agent1Page, true);
+
+      // Check - Desktop should be hidden
+      await hideDesktopCheckbox.click();
+      await testManager.agent1Page.waitForTimeout(500);
+      await verifyDesktopOptionVisibility(testManager.agent1Page, false);
+
+      // Uncheck again - Desktop should be visible again
+      await hideDesktopCheckbox.click();
+      await testManager.agent1Page.waitForTimeout(500);
+      await verifyDesktopOptionVisibility(testManager.agent1Page, true);
+    });
+  });
+
   test.describe('Station Login Tests - Desktop Mode', () => {
     let testManager: TestManager;
 
diff --git a/widgets-samples/cc/samples-cc-react-app/src/App.tsx b/widgets-samples/cc/samples-cc-react-app/src/App.tsx
index f13443a17..7d76b8560 100644
--- a/widgets-samples/cc/samples-cc-react-app/src/App.tsx
+++ b/widgets-samples/cc/samples-cc-react-app/src/App.tsx
@@ -78,6 +78,10 @@ function App() {
     const savedMultiPartyConferenceEnabled = window.localStorage.getItem('conferenceEnabled');
     return savedMultiPartyConferenceEnabled !== null ? savedMultiPartyConferenceEnabled === 'true' : true;
   });
+  const [hideDesktopLogin, setHideDesktopLogin] = useState(() => {
+    const savedHideDesktopLogin = window.localStorage.getItem('hideDesktopLogin');
+    return savedHideDesktopLogin === 'true';
+  });
 
   const handleSaveStart = () => {
     setShowLoader(true);
@@ -346,6 +350,9 @@ function App() {
   useEffect(() => {
     window.localStorage.setItem('conferenceEnabled', JSON.stringify(conferenceEnabled));
   }, [conferenceEnabled]);
+  useEffect(() => {
+    window.localStorage.setItem('hideDesktopLogin', JSON.stringify(hideDesktopLogin));
+  }, [hideDesktopLogin]);
 
   useEffect(() => {
     store.setIncomingTaskCb(onIncomingTaskCB);
@@ -543,16 +550,6 @@ function App() {
                         setShowAgentProfile(!showAgentProfile);
                       }}
                     />
-                    <Checkbox
-                      checked={doStationLogout}
-                      aria-label="theme checkbox"
-                      id="theme-checkbox"
-                      label="Do Station Logout"
-                      // @ts-expect-error: TODO: https://github.com/momentum-design/momentum-design/pull/1118
-                      onchange={() => {
-                        setDoStationLogout(!doStationLogout);
-                      }}
-                    />
                     <Checkbox
                       checked={integrationEnv}
                       aria-label="integration env checkbox"
@@ -712,6 +709,29 @@ function App() {
                     <section className="section-box">
                       <fieldset className="fieldset">
                         <legend className="legend-box">Station Login</legend>
+                        <div style={{marginBottom: '15px'}}>
+                          <Checkbox
+                            data-testid="samples:hide-desktop-login-checkbox"
+                            checked={hideDesktopLogin}
+                            aria-label="hide desktop login checkbox"
+                            id="hide-desktop-login-checkbox"
+                            label="Hide Desktop Login Mode"
+                            // @ts-expect-error: TODO: https://github.com/momentum-design/momentum-design/pull/1118
+                            onchange={() => {
+                              setHideDesktopLogin(!hideDesktopLogin);
+                            }}
+                          />
+                          <Checkbox
+                            checked={doStationLogout}
+                            aria-label="do station logout checkbox"
+                            id="do-station-logout-checkbox"
+                            label="Do Station Logout"
+                            // @ts-expect-error: TODO: https://github.com/momentum-design/momentum-design/pull/1118
+                            onchange={() => {
+                              setDoStationLogout(!doStationLogout);
+                            }}
+                          />
+                        </div>
                         <div className="station-login">
                           <StationLogin
                             onLogin={onLogin}
@@ -719,6 +739,7 @@ function App() {
                             onCCSignOut={onCCSignOut}
                             profileMode={false}
                             doStationLogout={doStationLogout}
+                            hideDesktopLogin={hideDesktopLogin}
                           />
                         </div>
                       </fieldset>
@@ -730,8 +751,26 @@ function App() {
                     <section className="section-box">
                       <fieldset className="fieldset">
                         <legend className="legend-box">Station Login (Profile Mode)</legend>
+                        <div style={{marginBottom: '15px'}}>
+                          <Checkbox
+                            data-testid="samples:hide-desktop-login-profile-checkbox"
+                            checked={hideDesktopLogin}
+                            aria-label="hide desktop login checkbox"
+                            id="hide-desktop-login-profile-checkbox"
+                            label="Hide Desktop Login Mode"
+                            // @ts-expect-error: TODO: https://github.com/momentum-design/momentum-design/pull/1118
+                            onchange={() => {
+                              setHideDesktopLogin(!hideDesktopLogin);
+                            }}
+                          />
+                        </div>
                         <div className="station-login">
-                          <StationLogin profileMode={true} onSaveStart={handleSaveStart} onSaveEnd={handleSaveEnd} />
+                          <StationLogin
+                            profileMode={true}
+                            onSaveStart={handleSaveStart}
+                            onSaveEnd={handleSaveEnd}
+                            hideDesktopLogin={hideDesktopLogin}
+                          />
                         </div>
                       </fieldset>
                     </section>

From 9f78bf25aae075695a4a5c21ebc60deabb1c0136 Mon Sep 17 00:00:00 2001
From: Kesava Krishnan Madavan <mkesavan13@gmail.com>
Date: Thu, 20 Nov 2025 14:39:18 +0530
Subject: [PATCH 2/2] test(station-login): update snapshots for desktop
 visibility toggle

---
 .../station-login.snapshot.tsx.snap           | 1335 ++++++++++++++++-
 .../StationLogin/station-login.snapshot.tsx   |   57 +
 2 files changed, 1346 insertions(+), 46 deletions(-)

diff --git a/packages/contact-center/cc-components/tests/components/StationLogin/__snapshots__/station-login.snapshot.tsx.snap b/packages/contact-center/cc-components/tests/components/StationLogin/__snapshots__/station-login.snapshot.tsx.snap
index 00663507e..61578042e 100644
--- a/packages/contact-center/cc-components/tests/components/StationLogin/__snapshots__/station-login.snapshot.tsx.snap
+++ b/packages/contact-center/cc-components/tests/components/StationLogin/__snapshots__/station-login.snapshot.tsx.snap
@@ -3101,6 +3101,609 @@ exports[`Station Login Component Rendering does not render loginOptions if not i
 </div>
 `;
 
+exports[`Station Login Component Rendering hides Desktop login option in profile mode when hideDesktopLogin is true 1`] = `
+<div>
+  <dialog
+    class="dialog-modal"
+    data-testid="multi-sign-in-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Multiple Sign In Alert
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      You are signed in to the Desktop in multiple application instances. Click Continue to proceed with the Desktop in this application instance. Else, close this window.
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="ContinueButton"
+        id="ContinueButton"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Continue
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="cc-logout-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Sign out of Contact Center
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to sign out?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="cc-cancel-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        data-testid="cc-logout-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Sign Out
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="interaction-confirmation-dialog"
+  >
+    <div
+      class="modal-header"
+      style="display: flex; justify-content: space-between; align-items: center;"
+    >
+      <mdc-text
+        class="modal-text"
+        tagname="h2"
+        type="body-large-bold"
+      >
+        Confirm interaction preference changes
+      </mdc-text>
+      <mdc-button
+        aria-label="Close"
+        class="cancelSaveLoginOptions"
+        color="default"
+        data-btn-type="icon"
+        postfix-icon=""
+        prefix-icon="cancel-bold"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="tertiary"
+      />
+    </div>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to save your interaction preferences changes?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Confirm
+      </mdc-button>
+    </div>
+  </dialog>
+  <div
+    class="box station-login"
+    data-testid="station-login-widget"
+  >
+    <section
+      class="section-box"
+    >
+      <div>
+        <div
+          id="agent-login-label"
+        >
+          <mdc-text
+            data-testid="station-login-label"
+            tagname="p"
+            type="body-midsize-regular"
+          >
+            Handle calls using
+          </mdc-text>
+          <mdc-icon
+            aria-describedby="agent-login-label-tooltip"
+            data-testid="station-login-icon"
+            id="agent-login-info-badge"
+            name="info-badge-filled"
+          />
+          <mdc-tooltip
+            append-to=""
+            color="contrast"
+            data-testid="station-login-tooltip"
+            delay="0,0"
+            disable-aria-expanded=""
+            flip=""
+            hide-on-blur=""
+            hide-on-escape=""
+            id="agent-login-label-tooltip"
+            offset="4"
+            placement="top"
+            role="tooltip"
+            show-arrow=""
+            style="z-index: 1000;"
+            tooltip-type="description"
+            trigger="mouseenter focusin"
+            triggerid="agent-login-info-badge"
+            z-index="1000"
+          >
+            <mdc-text
+              class="agent-login-popover"
+              data-testid="station-login-label"
+              tagname="div"
+              type="body-large-regular"
+            >
+              This is your preferred method for receiving and making calls. Choose between your phone number, extension (if available), or your web browser.
+            </mdc-text>
+          </mdc-tooltip>
+        </div>
+        <div>
+          <mdc-select
+            class="station-login-select"
+            data-testid="login-option-select"
+            help-text-type="default"
+            name="login-option"
+            value="EXTENSION"
+          >
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="false"
+              data-testid="login-option-Dial Number"
+              tabindex="0"
+              value="AGENT_DN"
+              variant="inset-rectangle"
+            >
+              Dial Number
+            </mdc-option>
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="true"
+              data-testid="login-option-Extension"
+              selected=""
+              tabindex="-1"
+              value="EXTENSION"
+              variant="inset-rectangle"
+            >
+              Extension
+            </mdc-option>
+          </mdc-select>
+        </div>
+      </div>
+      <mdc-input
+        data-testid="dial-number-input"
+        label=""
+        name=""
+        value=""
+      />
+      <div
+        class="select-container"
+      >
+        <mdc-select
+          class="station-login-select"
+          data-testid="teams-select-dropdown"
+          help-text-type="default"
+          label="Your Team"
+          name="teams-dropdown"
+        >
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="true"
+            data-testid="teams-dropdown-Team A"
+            selected=""
+            tabindex="0"
+            value="team123"
+            variant="inset-rectangle"
+          >
+            Team A
+          </mdc-option>
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="false"
+            data-testid="teams-dropdown-Team B"
+            tabindex="0"
+            value="team456"
+            variant="inset-rectangle"
+          >
+            Team B
+          </mdc-option>
+        </mdc-select>
+      </div>
+      <div
+        class="btn-container"
+      >
+        <mdc-button
+          aria-disabled="true"
+          color="positive"
+          data-testid="save-login-options-button"
+          disabled=""
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="primary"
+        >
+          Save
+        </mdc-button>
+      </div>
+    </section>
+  </div>
+</div>
+`;
+
+exports[`Station Login Component Rendering hides Desktop login option when hideDesktopLogin is true 1`] = `
+<div>
+  <dialog
+    class="dialog-modal"
+    data-testid="multi-sign-in-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Multiple Sign In Alert
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      You are signed in to the Desktop in multiple application instances. Click Continue to proceed with the Desktop in this application instance. Else, close this window.
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="ContinueButton"
+        id="ContinueButton"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Continue
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="cc-logout-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Sign out of Contact Center
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to sign out?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="cc-cancel-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        data-testid="cc-logout-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Sign Out
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="interaction-confirmation-dialog"
+  >
+    <div
+      class="modal-header"
+      style="display: flex; justify-content: space-between; align-items: center;"
+    >
+      <mdc-text
+        class="modal-text"
+        tagname="h2"
+        type="body-large-bold"
+      >
+        Confirm interaction preference changes
+      </mdc-text>
+      <mdc-button
+        aria-label="Close"
+        class="cancelSaveLoginOptions"
+        color="default"
+        data-btn-type="icon"
+        postfix-icon=""
+        prefix-icon="cancel-bold"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="tertiary"
+      />
+    </div>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to save your interaction preferences changes?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Confirm
+      </mdc-button>
+    </div>
+  </dialog>
+  <div
+    class="box station-login"
+    data-testid="station-login-widget"
+  >
+    <section
+      class="section-box"
+    >
+      <mdc-text
+        data-testid="station-login-label"
+        tagname="span"
+        type="body-large-bold"
+      >
+        Set your interaction preferences
+      </mdc-text>
+      <div>
+        <div
+          id="agent-login-label"
+        >
+          <mdc-text
+            data-testid="station-login-label"
+            tagname="p"
+            type="body-midsize-regular"
+          >
+            Handle calls using
+          </mdc-text>
+          <mdc-icon
+            aria-describedby="agent-login-label-tooltip"
+            data-testid="station-login-icon"
+            id="agent-login-info-badge"
+            name="info-badge-filled"
+          />
+          <mdc-tooltip
+            append-to=""
+            color="contrast"
+            data-testid="station-login-tooltip"
+            delay="0,0"
+            disable-aria-expanded=""
+            flip=""
+            hide-on-blur=""
+            hide-on-escape=""
+            id="agent-login-label-tooltip"
+            offset="4"
+            placement="top"
+            role="tooltip"
+            show-arrow=""
+            style="z-index: 1000;"
+            tooltip-type="description"
+            trigger="mouseenter focusin"
+            triggerid="agent-login-info-badge"
+            z-index="1000"
+          >
+            <mdc-text
+              class="agent-login-popover"
+              data-testid="station-login-label"
+              tagname="div"
+              type="body-large-regular"
+            >
+              This is your preferred method for receiving and making calls. Choose between your phone number, extension (if available), or your web browser.
+            </mdc-text>
+          </mdc-tooltip>
+        </div>
+        <div>
+          <mdc-select
+            class="station-login-select"
+            data-testid="login-option-select"
+            help-text-type="default"
+            name="login-option"
+            value="EXTENSION"
+          >
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="false"
+              data-testid="login-option-Dial Number"
+              tabindex="0"
+              value="AGENT_DN"
+              variant="inset-rectangle"
+            >
+              Dial Number
+            </mdc-option>
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="true"
+              data-testid="login-option-Extension"
+              selected=""
+              tabindex="-1"
+              value="EXTENSION"
+              variant="inset-rectangle"
+            >
+              Extension
+            </mdc-option>
+          </mdc-select>
+        </div>
+      </div>
+      <mdc-input
+        data-testid="dial-number-input"
+        label=""
+        name=""
+        value=""
+      />
+      <div
+        class="select-container"
+      >
+        <mdc-select
+          class="station-login-select"
+          data-testid="teams-select-dropdown"
+          help-text-type="default"
+          label="Your Team"
+          name="teams-dropdown"
+        >
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="true"
+            data-testid="teams-dropdown-Team A"
+            selected=""
+            tabindex="0"
+            value="team123"
+            variant="inset-rectangle"
+          >
+            Team A
+          </mdc-option>
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="false"
+            data-testid="teams-dropdown-Team B"
+            tabindex="0"
+            value="team456"
+            variant="inset-rectangle"
+          >
+            Team B
+          </mdc-option>
+        </mdc-select>
+      </div>
+      <div
+        class="btn-container"
+      >
+        <mdc-button
+          color="default"
+          data-testid="login-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="primary"
+        >
+          Save & Continue
+        </mdc-button>
+        <mdc-button
+          class="white-button"
+          color="default"
+          data-testid="sign-out-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="secondary"
+        >
+          Sign Out
+        </mdc-button>
+      </div>
+    </section>
+  </div>
+</div>
+`;
+
 exports[`Station Login Component Rendering renders login failure when passed 1`] = `
 <div>
   <dialog
@@ -3389,14 +3992,662 @@ exports[`Station Login Component Rendering renders login failure when passed 1`]
           </mdc-option>
         </mdc-select>
       </div>
-      <mdc-text
-        class="error-text-color"
-        data-testid="station-login-failure-label"
-        tagname="p"
-        type="body-midsize-regular"
-      >
-        This extension is already in use.
-      </mdc-text>
+      <mdc-text
+        class="error-text-color"
+        data-testid="station-login-failure-label"
+        tagname="p"
+        type="body-midsize-regular"
+      >
+        This extension is already in use.
+      </mdc-text>
+      <div
+        class="btn-container"
+      >
+        <mdc-button
+          color="default"
+          data-testid="login-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="primary"
+        >
+          Save & Continue
+        </mdc-button>
+        <mdc-button
+          class="white-button"
+          color="default"
+          data-testid="sign-out-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="secondary"
+        >
+          Sign Out
+        </mdc-button>
+      </div>
+    </section>
+  </div>
+</div>
+`;
+
+exports[`Station Login Component Rendering renders save error when passed 1`] = `
+<div>
+  <dialog
+    class="dialog-modal"
+    data-testid="multi-sign-in-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Multiple Sign In Alert
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      You are signed in to the Desktop in multiple application instances. Click Continue to proceed with the Desktop in this application instance. Else, close this window.
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="ContinueButton"
+        id="ContinueButton"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Continue
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="cc-logout-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Sign out of Contact Center
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to sign out?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="cc-cancel-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        data-testid="cc-logout-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Sign Out
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="interaction-confirmation-dialog"
+  >
+    <div
+      class="modal-header"
+      style="display: flex; justify-content: space-between; align-items: center;"
+    >
+      <mdc-text
+        class="modal-text"
+        tagname="h2"
+        type="body-large-bold"
+      >
+        Confirm interaction preference changes
+      </mdc-text>
+      <mdc-button
+        aria-label="Close"
+        class="cancelSaveLoginOptions"
+        color="default"
+        data-btn-type="icon"
+        postfix-icon=""
+        prefix-icon="cancel-bold"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="tertiary"
+      />
+    </div>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to save your interaction preferences changes?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Confirm
+      </mdc-button>
+    </div>
+  </dialog>
+  <div
+    class="box station-login"
+    data-testid="station-login-widget"
+  >
+    <section
+      class="section-box"
+    >
+      <mdc-text
+        data-testid="station-login-label"
+        tagname="span"
+        type="body-large-bold"
+      >
+        Set your interaction preferences
+      </mdc-text>
+      <div>
+        <div
+          id="agent-login-label"
+        >
+          <mdc-text
+            data-testid="station-login-label"
+            tagname="p"
+            type="body-midsize-regular"
+          >
+            Handle calls using
+          </mdc-text>
+          <mdc-icon
+            aria-describedby="agent-login-label-tooltip"
+            data-testid="station-login-icon"
+            id="agent-login-info-badge"
+            name="info-badge-filled"
+          />
+          <mdc-tooltip
+            append-to=""
+            color="contrast"
+            data-testid="station-login-tooltip"
+            delay="0,0"
+            disable-aria-expanded=""
+            flip=""
+            hide-on-blur=""
+            hide-on-escape=""
+            id="agent-login-label-tooltip"
+            offset="4"
+            placement="top"
+            role="tooltip"
+            show-arrow=""
+            style="z-index: 1000;"
+            tooltip-type="description"
+            trigger="mouseenter focusin"
+            triggerid="agent-login-info-badge"
+            z-index="1000"
+          >
+            <mdc-text
+              class="agent-login-popover"
+              data-testid="station-login-label"
+              tagname="div"
+              type="body-large-regular"
+            >
+              This is your preferred method for receiving and making calls. Choose between your phone number, extension (if available), or your web browser.
+            </mdc-text>
+          </mdc-tooltip>
+        </div>
+        <div>
+          <mdc-select
+            class="station-login-select"
+            data-testid="login-option-select"
+            help-text-type="default"
+            name="login-option"
+            value="EXTENSION"
+          >
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="false"
+              data-testid="login-option-Dial Number"
+              tabindex="0"
+              value="AGENT_DN"
+              variant="inset-rectangle"
+            >
+              Dial Number
+            </mdc-option>
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="true"
+              data-testid="login-option-Extension"
+              selected=""
+              tabindex="-1"
+              value="EXTENSION"
+              variant="inset-rectangle"
+            >
+              Extension
+            </mdc-option>
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="false"
+              data-testid="login-option-Desktop"
+              tabindex="-1"
+              value="BROWSER"
+              variant="inset-rectangle"
+            >
+              Desktop
+            </mdc-option>
+          </mdc-select>
+        </div>
+      </div>
+      <mdc-input
+        data-testid="dial-number-input"
+        label=""
+        name=""
+        value=""
+      />
+      <div
+        class="select-container"
+      >
+        <mdc-select
+          class="station-login-select"
+          data-testid="teams-select-dropdown"
+          help-text-type="default"
+          label="Your Team"
+          name="teams-dropdown"
+        >
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="true"
+            data-testid="teams-dropdown-Team A"
+            selected=""
+            tabindex="0"
+            value="team123"
+            variant="inset-rectangle"
+          >
+            Team A
+          </mdc-option>
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="false"
+            data-testid="teams-dropdown-Team B"
+            tabindex="0"
+            value="team456"
+            variant="inset-rectangle"
+          >
+            Team B
+          </mdc-option>
+        </mdc-select>
+      </div>
+      <mdc-text
+        class="error-text-color"
+        data-testid="save-error"
+        tagname="p"
+        type="body-midsize-regular"
+      >
+        Error in saving login options
+      </mdc-text>
+      <div
+        class="btn-container"
+      >
+        <mdc-button
+          color="default"
+          data-testid="login-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="primary"
+        >
+          Save & Continue
+        </mdc-button>
+        <mdc-button
+          class="white-button"
+          color="default"
+          data-testid="sign-out-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="secondary"
+        >
+          Sign Out
+        </mdc-button>
+      </div>
+    </section>
+  </div>
+</div>
+`;
+
+exports[`Station Login Component Rendering renders the component correctly 1`] = `
+<div>
+  <dialog
+    class="dialog-modal"
+    data-testid="multi-sign-in-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Multiple Sign In Alert
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      You are signed in to the Desktop in multiple application instances. Click Continue to proceed with the Desktop in this application instance. Else, close this window.
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="ContinueButton"
+        id="ContinueButton"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Continue
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="cc-logout-modal"
+  >
+    <mdc-text
+      class="modal-text"
+      tagname="h2"
+      type="body-large-bold"
+    >
+      Sign out of Contact Center
+    </mdc-text>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to sign out?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        data-testid="cc-cancel-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        data-testid="cc-logout-button"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Sign Out
+      </mdc-button>
+    </div>
+  </dialog>
+  <dialog
+    class="dialog-modal"
+    data-testid="interaction-confirmation-dialog"
+  >
+    <div
+      class="modal-header"
+      style="display: flex; justify-content: space-between; align-items: center;"
+    >
+      <mdc-text
+        class="modal-text"
+        tagname="h2"
+        type="body-large-bold"
+      >
+        Confirm interaction preference changes
+      </mdc-text>
+      <mdc-button
+        aria-label="Close"
+        class="cancelSaveLoginOptions"
+        color="default"
+        data-btn-type="icon"
+        postfix-icon=""
+        prefix-icon="cancel-bold"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="tertiary"
+      />
+    </div>
+    <mdc-text
+      class="modal-text"
+      tagname="p"
+      type="body-midsize-regular"
+    >
+      Are you sure you want to save your interaction preferences changes?
+    </mdc-text>
+    <div
+      class="dialog-modal-content"
+    >
+      <mdc-button
+        class="white-button"
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="secondary"
+      >
+        Cancel
+      </mdc-button>
+      <mdc-button
+        color="default"
+        role="button"
+        size="32"
+        tabindex="0"
+        type="button"
+        variant="primary"
+      >
+        Confirm
+      </mdc-button>
+    </div>
+  </dialog>
+  <div
+    class="box station-login"
+    data-testid="station-login-widget"
+  >
+    <section
+      class="section-box"
+    >
+      <mdc-text
+        data-testid="station-login-label"
+        tagname="span"
+        type="body-large-bold"
+      >
+        Set your interaction preferences
+      </mdc-text>
+      <div>
+        <div
+          id="agent-login-label"
+        >
+          <mdc-text
+            data-testid="station-login-label"
+            tagname="p"
+            type="body-midsize-regular"
+          >
+            Handle calls using
+          </mdc-text>
+          <mdc-icon
+            aria-describedby="agent-login-label-tooltip"
+            data-testid="station-login-icon"
+            id="agent-login-info-badge"
+            name="info-badge-filled"
+          />
+          <mdc-tooltip
+            append-to=""
+            color="contrast"
+            data-testid="station-login-tooltip"
+            delay="0,0"
+            disable-aria-expanded=""
+            flip=""
+            hide-on-blur=""
+            hide-on-escape=""
+            id="agent-login-label-tooltip"
+            offset="4"
+            placement="top"
+            role="tooltip"
+            show-arrow=""
+            style="z-index: 1000;"
+            tooltip-type="description"
+            trigger="mouseenter focusin"
+            triggerid="agent-login-info-badge"
+            z-index="1000"
+          >
+            <mdc-text
+              class="agent-login-popover"
+              data-testid="station-login-label"
+              tagname="div"
+              type="body-large-regular"
+            >
+              This is your preferred method for receiving and making calls. Choose between your phone number, extension (if available), or your web browser.
+            </mdc-text>
+          </mdc-tooltip>
+        </div>
+        <div>
+          <mdc-select
+            class="station-login-select"
+            data-testid="login-option-select"
+            help-text-type="default"
+            name="login-option"
+            value="EXTENSION"
+          >
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="false"
+              data-testid="login-option-Dial Number"
+              tabindex="0"
+              value="AGENT_DN"
+              variant="inset-rectangle"
+            >
+              Dial Number
+            </mdc-option>
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="true"
+              data-testid="login-option-Extension"
+              selected=""
+              tabindex="-1"
+              value="EXTENSION"
+              variant="inset-rectangle"
+            >
+              Extension
+            </mdc-option>
+            <mdc-option
+              aria-disabled="false"
+              aria-selected="false"
+              data-testid="login-option-Desktop"
+              tabindex="-1"
+              value="BROWSER"
+              variant="inset-rectangle"
+            >
+              Desktop
+            </mdc-option>
+          </mdc-select>
+        </div>
+      </div>
+      <mdc-input
+        data-testid="dial-number-input"
+        label=""
+        name=""
+        value=""
+      />
+      <div
+        class="select-container"
+      >
+        <mdc-select
+          class="station-login-select"
+          data-testid="teams-select-dropdown"
+          help-text-type="default"
+          label="Your Team"
+          name="teams-dropdown"
+        >
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="true"
+            data-testid="teams-dropdown-Team A"
+            selected=""
+            tabindex="0"
+            value="team123"
+            variant="inset-rectangle"
+          >
+            Team A
+          </mdc-option>
+          <mdc-option
+            aria-disabled="false"
+            aria-selected="false"
+            data-testid="teams-dropdown-Team B"
+            tabindex="0"
+            value="team456"
+            variant="inset-rectangle"
+          >
+            Team B
+          </mdc-option>
+        </mdc-select>
+      </div>
       <div
         class="btn-container"
       >
@@ -3429,7 +4680,7 @@ exports[`Station Login Component Rendering renders login failure when passed 1`]
 </div>
 `;
 
-exports[`Station Login Component Rendering renders save error when passed 1`] = `
+exports[`Station Login Component Rendering renders the component correctly in profileMode 1`] = `
 <div>
   <dialog
     class="dialog-modal"
@@ -3582,13 +4833,6 @@ exports[`Station Login Component Rendering renders save error when passed 1`] =
     <section
       class="section-box"
     >
-      <mdc-text
-        data-testid="station-login-label"
-        tagname="span"
-        type="body-large-bold"
-      >
-        Set your interaction preferences
-      </mdc-text>
       <div>
         <div
           id="agent-login-label"
@@ -3717,39 +4961,21 @@ exports[`Station Login Component Rendering renders save error when passed 1`] =
           </mdc-option>
         </mdc-select>
       </div>
-      <mdc-text
-        class="error-text-color"
-        data-testid="save-error"
-        tagname="p"
-        type="body-midsize-regular"
-      >
-        Error in saving login options
-      </mdc-text>
       <div
         class="btn-container"
       >
         <mdc-button
-          color="default"
-          data-testid="login-button"
+          aria-disabled="true"
+          color="positive"
+          data-testid="save-login-options-button"
+          disabled=""
           role="button"
           size="32"
           tabindex="0"
           type="button"
           variant="primary"
         >
-          Save & Continue
-        </mdc-button>
-        <mdc-button
-          class="white-button"
-          color="default"
-          data-testid="sign-out-button"
-          role="button"
-          size="32"
-          tabindex="0"
-          type="button"
-          variant="secondary"
-        >
-          Sign Out
+          Save
         </mdc-button>
       </div>
     </section>
@@ -3757,7 +4983,7 @@ exports[`Station Login Component Rendering renders save error when passed 1`] =
 </div>
 `;
 
-exports[`Station Login Component Rendering renders the component correctly 1`] = `
+exports[`Station Login Component Rendering shows Desktop login option when hideDesktopLogin is false 1`] = `
 <div>
   <dialog
     class="dialog-modal"
@@ -4077,7 +5303,7 @@ exports[`Station Login Component Rendering renders the component correctly 1`] =
 </div>
 `;
 
-exports[`Station Login Component Rendering renders the component correctly in profileMode 1`] = `
+exports[`Station Login Component Rendering shows Desktop login option when hideDesktopLogin is undefined 1`] = `
 <div>
   <dialog
     class="dialog-modal"
@@ -4230,6 +5456,13 @@ exports[`Station Login Component Rendering renders the component correctly in pr
     <section
       class="section-box"
     >
+      <mdc-text
+        data-testid="station-login-label"
+        tagname="span"
+        type="body-large-bold"
+      >
+        Set your interaction preferences
+      </mdc-text>
       <div>
         <div
           id="agent-login-label"
@@ -4362,17 +5595,27 @@ exports[`Station Login Component Rendering renders the component correctly in pr
         class="btn-container"
       >
         <mdc-button
-          aria-disabled="true"
-          color="positive"
-          data-testid="save-login-options-button"
-          disabled=""
+          color="default"
+          data-testid="login-button"
           role="button"
           size="32"
           tabindex="0"
           type="button"
           variant="primary"
         >
-          Save
+          Save & Continue
+        </mdc-button>
+        <mdc-button
+          class="white-button"
+          color="default"
+          data-testid="sign-out-button"
+          role="button"
+          size="32"
+          tabindex="0"
+          type="button"
+          variant="secondary"
+        >
+          Sign Out
         </mdc-button>
       </div>
     </section>
diff --git a/packages/contact-center/cc-components/tests/components/StationLogin/station-login.snapshot.tsx b/packages/contact-center/cc-components/tests/components/StationLogin/station-login.snapshot.tsx
index 353fdb1fd..0b27a08c9 100644
--- a/packages/contact-center/cc-components/tests/components/StationLogin/station-login.snapshot.tsx
+++ b/packages/contact-center/cc-components/tests/components/StationLogin/station-login.snapshot.tsx
@@ -164,6 +164,63 @@ describe('Station Login Component', () => {
       container.querySelectorAll('[id^="mdc-input"]').forEach((el) => el.removeAttribute('id'));
       expect(container).toMatchSnapshot();
     });
+
+    it('hides Desktop login option when hideDesktopLogin is true', async () => {
+      const {container} = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={true}
+          profileMode={false}
+        />
+      );
+      // Remove IDs to avoid snapshot issues with dynamic IDs
+      container.querySelectorAll('[id^="mdc-input"]').forEach((el) => el.removeAttribute('id'));
+      expect(container).toMatchSnapshot();
+    });
+
+    it('shows Desktop login option when hideDesktopLogin is false', async () => {
+      const {container} = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={false}
+          profileMode={false}
+        />
+      );
+      // Remove IDs to avoid snapshot issues with dynamic IDs
+      container.querySelectorAll('[id^="mdc-input"]').forEach((el) => el.removeAttribute('id'));
+      expect(container).toMatchSnapshot();
+    });
+
+    it('shows Desktop login option when hideDesktopLogin is undefined', async () => {
+      const {container} = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={undefined}
+          profileMode={false}
+        />
+      );
+      // Remove IDs to avoid snapshot issues with dynamic IDs
+      container.querySelectorAll('[id^="mdc-input"]').forEach((el) => el.removeAttribute('id'));
+      expect(container).toMatchSnapshot();
+    });
+
+    it('hides Desktop login option in profile mode when hideDesktopLogin is true', async () => {
+      const {container} = await render(
+        <StationLoginComponent
+          {...props}
+          loginOptions={['AGENT_DN', 'EXTENSION', 'BROWSER']}
+          hideDesktopLogin={true}
+          profileMode={true}
+          isAgentLoggedIn={true}
+        />
+      );
+      // Remove IDs to avoid snapshot issues with dynamic IDs
+      container.querySelectorAll('[id^="mdc-input"]').forEach((el) => el.removeAttribute('id'));
+      expect(container).toMatchSnapshot();
+    });
   });
 
   describe('Actions', () => {