[INS-1700] Delete Websocket Request

packages/insomnia/src/models/helpers/request-operations.ts

@@ -1,12 +1,16 @@
 import { GrpcRequest, isGrpcRequest, isGrpcRequestId } from '../grpc-request';
 import * as models from '../index';
 import { Request } from '../request';
-import { isWebSocketRequest, WebSocketRequest } from '../websocket-request';
+import { isWebSocketRequest, isWebSocketRequestId, WebSocketRequest } from '../websocket-request';
 
-export function getById(requestId: string): Promise<Request | GrpcRequest | null> {
-  return isGrpcRequestId(requestId)
-    ? models.grpcRequest.getById(requestId)
-    : models.request.getById(requestId);
+export function getById(requestId: string): Promise<Request | GrpcRequest | WebSocketRequest | null> {
+  if (isGrpcRequestId(requestId)) {
+    return models.grpcRequest.getById(requestId);
+  } else if (isWebSocketRequestId(requestId)) {
+    return models.websocketRequest.getById(requestId);
+  } else {
+    return models.request.getById(requestId);
+  }
 }
 
 export function remove(request: Request | GrpcRequest | WebSocketRequest) {
@@ -22,16 +26,32 @@ export function remove(request: Request | GrpcRequest | WebSocketRequest) {
 
 export function update<T extends object>(request: T, patch: Partial<T> = {}): Promise<T> {
   // @ts-expect-error -- TSCONVERSION
-  return isGrpcRequest(request)
-    ? models.grpcRequest.update(request, patch)
+  if (isGrpcRequest(request)) {
+    // @ts-expect-error -- TSCONVERSION
+    return models.grpcRequest.update(request, patch);
+  }
   // @ts-expect-error -- TSCONVERSION
-    : models.request.update(request, patch);
+  if (isWebSocketRequest(request)) {
+    // @ts-expect-error -- TSCONVERSION
+    return models.websocketRequest.update(request, patch);
+  } else {
+    // @ts-expect-error -- TSCONVERSION
+    return models.request.update(request, patch);
+  }
 }
 
 export function duplicate<T extends object>(request: T, patch: Partial<T> = {}): Promise<T> {
   // @ts-expect-error -- TSCONVERSION
-  return isGrpcRequest(request)
-    ? models.grpcRequest.duplicate(request, patch)
+  if (isGrpcRequest(request)) {
+    // @ts-expect-error -- TSCONVERSION
+    return models.grpcRequest.duplicate(request, patch);
+  }
   // @ts-expect-error -- TSCONVERSION
-    : models.request.duplicate(request, patch);
+  if (isWebSocketRequest(request)) {
+    // @ts-expect-error -- TSCONVERSION
+    return models.websocketRequest.duplicate(request, patch);
+  } else {
+    // @ts-expect-error -- TSCONVERSION
+    return models.request.duplicate(request, patch);
+  }
 }

packages/insomnia/src/models/websocket-request.ts

@@ -23,6 +23,10 @@ export const isWebSocketRequest = (model: Pick<BaseModel, 'type'>): model is Web
   model.type === type
 );
 
+export const isWebSocketRequestId = (id: string | null) => (
+  id?.startsWith(`${prefix}_`)
+);
+
 export const init = (): BaseWebSocketRequest => ({
   name: 'New WebSocket Request',
   url: '',
@@ -46,6 +50,37 @@ export const update = (
   patch: Partial<WebSocketRequest> = {}
 ) => database.docUpdate(obj, patch);
 
+// This is duplicated (lol) from models/request.js
+export async function duplicate(request: WebSocketRequest, patch: Partial<WebSocketRequest> = {}) {
+  // Only set name and "(Copy)" if the patch does
+  // not define it and the request itself has a name.
+  // Otherwise leave it blank so the request URL can
+  // fill it in automatically.
+  if (!patch.name && request.name) {
+    patch.name = `${request.name} (Copy)`;
+  }
+
+  // Get sort key of next request
+  const q = {
+    metaSortKey: {
+      $gt: request.metaSortKey,
+    },
+  };
+  // @ts-expect-error -- Database TSCONVERSION
+  const [nextRequest] = await db.find<WebSocketRequest>(type, q, {
+    metaSortKey: 1,
+  });
+  const nextSortKey = nextRequest ? nextRequest.metaSortKey : request.metaSortKey + 100;
+  // Calculate new sort key
+  const sortKeyIncrement = (nextSortKey - request.metaSortKey) / 2;
+  const metaSortKey = request.metaSortKey + sortKeyIncrement;
+  return database.duplicate<WebSocketRequest>(request, {
+    name,
+    metaSortKey,
+    ...patch,
+  });
+}
+
 export const getById = (_id: string) => database.getWhere<WebSocketRequest>(type, { _id });
 
 export const all = () => database.all<WebSocketRequest>(type);

packages/insomnia/src/ui/components/dropdowns/websocket-request-actions-dropdown.tsx

@@ -0,0 +1,74 @@
+import React, { forwardRef, useCallback } from 'react';
+import { useSelector } from 'react-redux';
+
+import { hotKeyRefs } from '../../../common/hotkeys';
+import * as requestOperations from '../../../models/helpers/request-operations';
+import { incrementDeletedRequests } from '../../../models/stats';
+import { WebSocketRequest } from '../../../models/websocket-request';
+import { updateRequestMetaByParentId } from '../../hooks/create-request';
+import { selectHotKeyRegistry } from '../../redux/selectors';
+import { type DropdownHandle, type DropdownProps, Dropdown } from '../base/dropdown/dropdown';
+import { DropdownButton } from '../base/dropdown/dropdown-button';
+import { DropdownDivider } from '../base/dropdown/dropdown-divider';
+import { DropdownHint } from '../base/dropdown/dropdown-hint';
+import { DropdownItem } from '../base/dropdown/dropdown-item';
+import { PromptButton } from '../base/prompt-button';
+
+interface Props extends Pick<DropdownProps, 'right'> {
+  handleDuplicateRequest: Function;
+  isPinned: Boolean;
+  request: WebSocketRequest;
+}
+
+export const WebSocketRequestActionsDropdown = forwardRef<DropdownHandle, Props>(({
+  handleDuplicateRequest,
+  isPinned,
+  request,
+  right,
+}, ref) => {
+  const hotKeyRegistry = useSelector(selectHotKeyRegistry);
+
+  const duplicate = useCallback(() => {
+    handleDuplicateRequest(request);
+  }, [handleDuplicateRequest, request]);
+
+  const togglePin = useCallback(() => {
+    updateRequestMetaByParentId(request._id, { pinned: !isPinned });
+  }, [isPinned, request]);
+
+  const deleteRequest = useCallback(() => {
+    incrementDeletedRequests();
+    requestOperations.remove(request);
+  }, [request]);
+
+  return (
+    <Dropdown right={right} ref={ref}>
+      <DropdownButton>
+        <i className="fa fa-caret-down" />
+      </DropdownButton>
+
+      <DropdownItem onClick={duplicate}>
+        <i className="fa fa-copy" /> Duplicate
+        <DropdownHint keyBindings={hotKeyRegistry[hotKeyRefs.REQUEST_SHOW_DUPLICATE.id]} />
+      </DropdownItem>
+
+      <DropdownItem onClick={togglePin}>
+        <i className="fa fa-thumb-tack" /> {isPinned ? 'Unpin' : 'Pin'}
+        <DropdownHint keyBindings={hotKeyRegistry[hotKeyRefs.REQUEST_TOGGLE_PIN.id]} />
+      </DropdownItem>
+
+      <DropdownItem
+        buttonClass={PromptButton}
+        onClick={deleteRequest}
+        addIcon
+      >
+        <i className="fa fa-trash-o" /> Delete
+        <DropdownHint keyBindings={hotKeyRegistry[hotKeyRefs.REQUEST_SHOW_DELETE.id]} />
+      </DropdownItem>
+
+      <DropdownDivider />
+    </Dropdown>
+  );
+});
+
+WebSocketRequestActionsDropdown.displayName = 'RequestActionsDropdown';

packages/insomnia/src/ui/components/sidebar/sidebar-request-row.tsx

@@ -17,6 +17,7 @@ import type { DropdownHandle } from '../base/dropdown/dropdown';
 import { Editable } from '../base/editable';
 import { Highlight } from '../base/highlight';
 import { RequestActionsDropdown } from '../dropdowns/request-actions-dropdown';
+import { WebSocketRequestActionsDropdown } from '../dropdowns/websocket-request-actions-dropdown';
 import { GrpcSpinner } from '../grpc-spinner';
 import { showModal } from '../modals/index';
 import { RequestSettingsModal } from '../modals/request-settings-modal';
@@ -250,7 +251,15 @@ export const _SidebarRequestRow: FC<Props> = forwardRef(({
             </div>
           </button>
           <div className="sidebar__actions">
-            {!isWebSocketRequest(request) && (
+            {isWebSocketRequest(request) ? (
+              <WebSocketRequestActionsDropdown
+                right
+                ref={requestActionsDropdown}
+                handleDuplicateRequest={handleDuplicateRequest}
+                request={request}
+                isPinned={isPinned}
+              />
+            ) : (
               <RequestActionsDropdown
                 right
                 ref={requestActionsDropdown}