initial implementation of new feature

src/renderer/components/SettingBarContext.vue

@@ -3,6 +3,27 @@
       :context-event="contextEvent"
       @close-context="$emit('close-context')"
    >
+      <div
+         v-if="isPinned"
+         class="context-element"
+         @click="unpin"
+      >
+         <span class="d-flex"><i class="mdi mdi-18px mdi-pin-off text-light pr-1" /> {{ $t('word.unpin') }}</span>
+      </div>
+      <div
+         v-else
+         class="context-element"
+         @click="pin"
+      >
+         <span class="d-flex"><i class="mdi mdi-18px mdi-pin mdi-rotate-45 text-light pr-1" /> {{ $t('word.pin') }}</span>
+      </div>
+      <div
+         v-if="isConnected"
+         class="context-element"
+         @click="disconnect"
+      >
+         <span class="d-flex"><i class="mdi mdi-18px mdi-power text-light pr-1" /> {{ $t('word.disconnect') }}</span>
+      </div>
       <div class="context-element" @click="duplicateConnection">
          <span class="d-flex"><i class="mdi mdi-18px mdi-content-duplicate text-light pr-1" /> {{ $t('word.duplicate') }}</span>
       </div>
@@ -39,15 +60,26 @@ import BaseContextMenu from '@/components/BaseContextMenu.vue';
 import ConfirmModal from '@/components/BaseConfirmModal.vue';
 import { ConnectionParams } from 'common/interfaces/antares';
 
+const connectionsStore = useConnectionsStore();
+
 const {
    getConnectionName,
    addConnection,
-   deleteConnection
-} = useConnectionsStore();
+   deleteConnection,
+   pinConnection,
+   unpinConnection
+} = connectionsStore;
+
+const { pinnedConnections } = storeToRefs(connectionsStore);
+
 const workspacesStore = useWorkspacesStore();
 const { getSelected: selectedWorkspace } = storeToRefs(workspacesStore);
 
-const { selectWorkspace } = workspacesStore;
+const {
+   selectWorkspace,
+   removeConnected: disconnectWorkspace,
+   getWorkspace
+} = workspacesStore;
 
 const props = defineProps({
    contextEvent: MouseEvent,
@@ -59,6 +91,8 @@ const emit = defineEmits(['close-context']);
 const isConfirmModal = ref(false);
 
 const connectionName = computed(() => getConnectionName(props.contextConnection.uid));
+const isConnected = computed(() => getWorkspace(props.contextConnection.uid).connectionStatus === 'connected');
+const isPinned = computed(() => pinnedConnections.value.has(props.contextConnection.uid));
 
 const confirmDeleteConnection = () => {
    if (selectedWorkspace.value === props.contextConnection.uid)
@@ -88,6 +122,21 @@ const hideConfirmModal = () => {
    closeContext();
 };
 
+const pin = () => {
+   pinConnection(props.contextConnection.uid);
+   closeContext();
+};
+
+const unpin = () => {
+   unpinConnection(props.contextConnection.uid);
+   closeContext();
+};
+
+const disconnect = () => {
+   disconnectWorkspace(props.contextConnection.uid);
+   closeContext();
+};
+
 const closeContext = () => {
    emit('close-context');
 };

src/renderer/components/TheSettingBar.vue

@@ -70,7 +70,7 @@ const connectionsStore = useConnectionsStore();
 const workspacesStore = useWorkspacesStore();
 
 const { updateStatus } = storeToRefs(applicationStore);
-const { connections: getConnections } = storeToRefs(connectionsStore);
+const { connections: storedConnections, pinnedConnections, lastConnections } = storeToRefs(connectionsStore);
 const { getSelected: selectedWorkspace } = storeToRefs(workspacesStore);
 
 const { showSettingModal, showScratchpad } = applicationStore;
@@ -85,13 +85,16 @@ const contextConnection: Ref<ConnectionParams> = ref(null);
 
 const connections = computed({
    get () {
-      return getConnections.value;
+      return storedConnections.value;
    },
    set (value: ConnectionParams[]) {
       updateConnections(value);
    }
 });
 
+const pinnedConnectionsArr = computed(() => storedConnections.value.filter(c => pinnedConnections.value.has(c.uid)));
+const unpinnedConnectionsArr = computed(() => storedConnections.value.filter(c => !pinnedConnections.value.has(c.uid)));
+
 const hasUpdates = computed(() => ['available', 'downloading', 'downloaded', 'link'].includes(updateStatus.value));
 
 const contextMenu = (event: MouseEvent, connection: ConnectionParams) => {