Add workbook shared entry actions (#3197)

Author: dvortsovs

src/shared/schema/us/actions/entries/index.ts

@@ -44,6 +44,8 @@ import type {
     GetRevisionsResponse,
     GetSharedEntryBindingsArgs,
     GetSharedEntryBindingsResponse,
+    GetSharedEntryWorkbookRelationsArgs,
+    GetSharedEntryWorkbookRelationsResponse,
     MoveEntryArgs,
     MoveEntryResponse,
     RenameEntryArgs,
@@ -303,4 +305,18 @@ export const entriesActions = {
             headers,
         }),
     }),
+    getSharedEntryWorkbookRelations: createAction<
+        GetSharedEntryWorkbookRelationsResponse,
+        GetSharedEntryWorkbookRelationsArgs
+    >({
+        method: 'GET',
+        path: ({entryId}) => `${PATH_PREFIX}/shared-entries/${entryId}/workbook-relations`,
+        params: ({scope, workbookId}, headers) => ({
+            query: {
+                workbookId,
+                scope,
+            },
+            headers,
+        }),
+    }),
 };

src/shared/schema/us/types/entries.ts

@@ -21,6 +21,7 @@ import type {
     EntryNavigationFields,
     EntryRelationFields,
     SharedEntryPermissions,
+    SharedEntryRelationFields,
 } from './fields';
 
 export interface GetEntryResponse extends EntryFields {
@@ -313,3 +314,13 @@ export type SharedEntryBindingsItem = {
 export type GetSharedEntryBindingsResponse = {
     items: SharedEntryBindingsItem[];
 };
+
+export type GetSharedEntryWorkbookRelationsArgs = {
+    entryId: string;
+    workbookId: string;
+    scope?: `${EntryScope}`;
+};
+
+export type GetSharedEntryWorkbookRelationsResponse = {
+    relations: SharedEntryRelationFields[];
+};

src/shared/schema/us/types/fields.ts

@@ -132,6 +132,11 @@ export interface EntryRelationFields {
     isLocked: boolean;
 }
 
+export type SharedEntryRelationFields = Omit<EntryRelationFields, 'isLocked'> & {
+    collectionId: string;
+    createdAt: string;
+};
+
 export interface TenantSettings {
     defaultColorPaletteId?: string;
 }

src/ui/components/DialogSharedEntryBindings/DialogSharedEntryBindings.scss

@@ -47,8 +47,6 @@
     }
 
     &__footer {
-        margin-left: -32px;
-        margin-right: -32px;
         border-top: 1px solid var(--g-color-line-generic);
         &_empty-list {
             border: none;

src/ui/components/DialogSharedEntryBindings/DialogSharedEntryBindings.tsx

@@ -53,8 +53,11 @@ export const DialogSharedEntryBindings: React.FC<DialogSharedEntryBindingsProps>
         onDirectionChange,
         currentDirection,
         fetchEntityBindings,
+        isLoadingDelete,
+        onDelete,
     } = useSharedEntryBindings({
         entry,
+        onDeleteSuccess,
     });
     const showDirectionControl = entry.scope === 'dataset';
 
@@ -71,11 +74,12 @@ export const DialogSharedEntryBindings: React.FC<DialogSharedEntryBindingsProps>
                     title={getSharedEntryMockText('label-current-entry')}
                     className={b('current-row')}
                 />
-                {isLoading && !isSearchLoading ? (
+                {(isLoading || isLoadingDelete) && !isSearchLoading ? (
                     <SmartLoader showAfter={0} />
                 ) : (
                     <>
                         <DeleteAlert
+                            isSearchActive={searchValue !== ''}
                             isDeleteDialog={isDeleteDialog}
                             entry={entry}
                             entities={entities}
@@ -105,17 +109,16 @@ export const DialogSharedEntryBindings: React.FC<DialogSharedEntryBindingsProps>
                         />
                     </>
                 )}
-                {isDeleteDialog && (
-                    <SharedBindingsFooter
-                        onClose={onClose}
-                        entry={entry}
-                        onRefresh={() => fetchEntityBindings(searchValue)}
-                        isLoading={isLoading || isSearchLoading}
-                        emptyList={entities.length === 0}
-                        onDeleteSuccess={onDeleteSuccess}
-                    />
-                )}
             </Dialog.Body>
+            {isDeleteDialog && (
+                <SharedBindingsFooter
+                    onClose={onClose}
+                    onRefresh={() => fetchEntityBindings(searchValue)}
+                    isLoading={isLoading || isSearchLoading || isLoadingDelete}
+                    emptyList={entities.length === 0}
+                    onDelete={onDelete}
+                />
+            )}
         </Dialog>
     );
 };

src/ui/components/DialogSharedEntryBindings/components/DeleteAlert.tsx

@@ -15,12 +15,19 @@ type DeleteAlertProps = {
     entities: SharedEntryBindingsItem[];
     isDeleteDialog: boolean;
     isError: boolean;
+    isSearchActive: boolean;
 };
 
 const b = block(DialogClassName);
 
-export const DeleteAlert = ({entities, entry, isDeleteDialog, isError}: DeleteAlertProps) => {
-    if (!isDeleteDialog || isError) {
+export const DeleteAlert = ({
+    entities,
+    entry,
+    isDeleteDialog,
+    isError,
+    isSearchActive,
+}: DeleteAlertProps) => {
+    if (!isDeleteDialog || isError || (isSearchActive && entities.length === 0)) {
         return null;
     }
 

src/ui/components/DialogSharedEntryBindings/components/Relations.tsx

@@ -174,7 +174,7 @@ export const Relations = ({
         );
     }
 
-    if (isDeleteDialog && entities.length === 0) {
+    if (isDeleteDialog && entities.length === 0 && searchValue === '') {
         return null;
     }
 

src/ui/components/DialogSharedEntryBindings/components/SharedBindingsFooter.tsx

@@ -2,14 +2,9 @@ import React from 'react';
 
 import {Button, Dialog, Icon} from '@gravity-ui/uikit';
 import block from 'bem-cn-lite';
-import {useDispatch} from 'react-redux';
-import {getSdk} from 'ui/libs/schematic-sdk';
-import type {AppDispatch} from 'ui/store';
-import {showToast} from 'ui/store/actions/toaster';
 import {getSharedEntryMockText} from 'ui/units/collections/components/helpers';
 
 import {DialogClassName} from '../constants';
-import type {SharedEntry} from '../types';
 
 import ArrowsRotateRightIcon from '@gravity-ui/icons/svgs/arrows-rotate-right.svg';
 
@@ -18,43 +13,18 @@ type SharedBindingsFooterProps = {
     onRefresh: () => void;
     onClose: () => void;
     emptyList: boolean;
-    entry: SharedEntry;
-    onDeleteSuccess?: () => void;
+    onDelete: () => void;
 };
 
 const b = block(DialogClassName);
 
 export const SharedBindingsFooter = ({
-    entry,
     isLoading,
     onRefresh,
     emptyList,
     onClose,
-    onDeleteSuccess,
+    onDelete,
 }: SharedBindingsFooterProps) => {
-    const dispatch: AppDispatch = useDispatch();
-    const [isLoadingDelete, setIsLoadingDelete] = React.useState(false);
-
-    const onDelete = React.useCallback(async () => {
-        setIsLoadingDelete(true);
-        try {
-            await getSdk().sdk.mix.deleteEntry({
-                entryId: entry.entryId,
-                scope: entry.scope,
-            });
-            setIsLoadingDelete(false);
-            onDeleteSuccess?.();
-        } catch (error) {
-            setIsLoadingDelete(false);
-            dispatch(
-                showToast({
-                    title: error.message,
-                    error,
-                }),
-            );
-        }
-    }, [onDeleteSuccess, entry, dispatch]);
-
     return (
         <Dialog.Footer
             textButtonApply={getSharedEntryMockText('apply-bindings-dialog-delete')}
@@ -65,17 +35,12 @@ export const SharedBindingsFooter = ({
                 view: 'flat',
             }}
             className={b('footer', {'empty-list': emptyList})}
-            loading={isLoading || isLoadingDelete}
+            loading={isLoading}
             textButtonCancel={getSharedEntryMockText('cancel-bindings-dialog-delete')}
             onClickButtonApply={onDelete}
             onClickButtonCancel={onClose}
         >
-            <Button
-                loading={isLoading || isLoadingDelete}
-                view="outlined"
-                size="l"
-                onClick={onRefresh}
-            >
+            <Button loading={isLoading} view="outlined" size="l" onClick={onRefresh}>
                 <Icon data={ArrowsRotateRightIcon} />
                 {getSharedEntryMockText('bindings-dialog-delete-refresh-btn')}
             </Button>

src/ui/components/DialogSharedEntryBindings/hooks/useSharedEntryBindings.ts

@@ -1,21 +1,27 @@
 import React from 'react';
 
 import debounce from 'lodash/debounce';
+import {useDispatch} from 'react-redux';
 import type {SharedEntryBindingsItem} from 'shared/schema';
 import {getSdk} from 'ui/libs/schematic-sdk';
+import type {AppDispatch} from 'ui/store';
+import {showToast} from 'ui/store/actions/toaster';
 
 import type {AttachmentValue} from '../constants';
 import {Attachment, SEARCH_DELAY} from '../constants';
 import type {SharedEntry} from '../types';
 import {sortEntities} from '../utils';
+
 type UseSharedEntryBindingsProps = {
     entry: SharedEntry;
+    onDeleteSuccess?: () => void;
 };
 
 const CONCURRENT_ID = 'shared-entry-bindings';
 const cancelConcurrentRequest = () => getSdk().cancelRequest(CONCURRENT_ID);
 
-export const useSharedEntryBindings = ({entry}: UseSharedEntryBindingsProps) => {
+export const useSharedEntryBindings = ({entry, onDeleteSuccess}: UseSharedEntryBindingsProps) => {
+    const dispatch: AppDispatch = useDispatch();
     const [entities, setEntities] = React.useState<SharedEntryBindingsItem[]>([]);
 
     const [currentDirection, setCurrentDirection] = React.useState<AttachmentValue>(
@@ -25,6 +31,27 @@ export const useSharedEntryBindings = ({entry}: UseSharedEntryBindingsProps) =>
     const [isLoading, setIsLoading] = React.useState(true);
     const [isSearchLoading, setIsSearchLoading] = React.useState(false);
     const [isError, setIsError] = React.useState(false);
+    const [isLoadingDelete, setIsLoadingDelete] = React.useState(false);
+
+    const onDelete = React.useCallback(async () => {
+        setIsLoadingDelete(true);
+        try {
+            await getSdk().sdk.mix.deleteEntry({
+                entryId: entry.entryId,
+                scope: entry.scope,
+            });
+            setIsLoadingDelete(false);
+            onDeleteSuccess?.();
+        } catch (error) {
+            setIsLoadingDelete(false);
+            dispatch(
+                showToast({
+                    title: error.message,
+                    error,
+                }),
+            );
+        }
+    }, [onDeleteSuccess, entry, dispatch]);
 
     const fetchEntityBindings = React.useCallback(
         (filter = '') => {
@@ -91,6 +118,8 @@ export const useSharedEntryBindings = ({entry}: UseSharedEntryBindingsProps) =>
     return {
         isError,
         isLoading,
+        isLoadingDelete,
+        onDelete,
         isSearchLoading,
         onSearch,
         searchValue: searchFilter,

src/ui/store/actions/openDialogTypes.ts

@@ -24,6 +24,7 @@ import type {OpenDialogColumnSettingsArgs} from '../../units/wizard/components/D
 import type {OpenDialogFieldEditorArgs} from '../../components/DialogFieldEditor/DialogFieldEditor';
 import type {OpenDialogRenameEntryInNewWorkbookArgs} from '../../units/workbooks/components/RenameEntryDialog/RenameEntryDialog';
 import type {OpenDialogDeleteEntryInNewWorkbookArgs} from '../../units/workbooks/components/DeleteEntryDialog/DeleteEntryDialog';
+import type {OpenDialogDeleteSharedEntryInWorkbookArgs} from '../../units/workbooks/components/DeleteSharedEntryDialog/DeleteSharedEntryDialog';
 import type {OpenDialogDuplicateEntryInWorkbookArgs} from '../../units/workbooks/components/DuplicateEntryDialog/DuplicateEntryDialog';
 import type {OpenDialogConnS3Sources} from '../../units/connections/components/dialogs';
 import type {OpenDialogConnWithInputArgs} from '../../units/connections/components/custom-forms/components/DialogWithInput';
@@ -129,4 +130,5 @@ export type OpenDialogArgs<T = unknown> =
     | OpenDialogSharedEntryUnbindArgs
     | OpenDialogSharedEntryPermissionsArgs
     | OpenDialogSelectSharedEntryArgs
+    | OpenDialogDeleteSharedEntryInWorkbookArgs
     | OpenDialogEntryDescriptionArgs;