starred/yaak
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-04-20 07:51:20 +02:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

A couple tweaks

Browse Source
This commit is contained in:
Gregory Schier
2023-03-19 01:01:13 -07:00
parent f8329f5b8d
commit df136fa915
1 changed files with 8 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src-web/components/Sidebar.tsx
View File

@@ -8,7 +8,7 @@ import type {
import React, { forwardRef, Fragment, memo, useCallback, useMemo, useRef, useState } from 'react'; import React, { forwardRef, Fragment, memo, useCallback, useMemo, useRef, useState } from 'react';
import type { XYCoord } from 'react-dnd'; import type { XYCoord } from 'react-dnd';
import { DndProvider, useDrag, useDragLayer, useDrop } from 'react-dnd'; import { DndProvider, useDrag, useDragLayer, useDrop } from 'react-dnd';
import { HTML5Backend } from 'react-dnd-html5-backend'; import { getEmptyImage, HTML5Backend } from 'react-dnd-html5-backend';
import { useActiveRequest } from '../hooks/useActiveRequest'; import { useActiveRequest } from '../hooks/useActiveRequest';
import { useCreateRequest } from '../hooks/useCreateRequest'; import { useCreateRequest } from '../hooks/useCreateRequest';
import { useDeleteRequest } from '../hooks/useDeleteRequest'; import { useDeleteRequest } from '../hooks/useDeleteRequest';
@@ -134,7 +134,7 @@ export function Container({ className }: Props) {
activeRequestId={activeRequest?.id} activeRequestId={activeRequest?.id}
requests={requests} requests={requests}
/> />
{/*<CustomDragLayer sidebarWidth={sidebarWidth} />*/} <CustomDragLayer sidebarWidth={sidebarWidth} />
</VStack> </VStack>
</ScrollArea> </ScrollArea>
<HStack className="mx-1 pb-1" alignItems="center" justifyContent="end"> <HStack className="mx-1 pb-1" alignItems="center" justifyContent="end">
@@ -414,18 +414,15 @@ const DraggableSidebarItem = memo(function DraggableSidebarItem({
item: () => ({ id: requestId, requestName, workspaceId }), item: () => ({ id: requestId, requestName, workspaceId }),
collect: (m) => ({ isDragging: m.isDragging() }), collect: (m) => ({ isDragging: m.isDragging() }),
options: { dropEffect: 'move' }, options: { dropEffect: 'move' },
end: (item, monitor) => { end: () => {
if (monitor.didDrop()) { // TODO: Call cancel if dropped outside of sidebar
onEnd(requestId); onEnd(requestId);
} else {
onCancel();
}
}, },
}), }),
[onEnd], [onEnd],
); );
// preview(getEmptyImage(), { captureDraggingState: true }); preview(getEmptyImage(), { captureDraggingState: true });
connectDrag(ref); connectDrag(ref);
connectDrop(ref); connectDrop(ref);
@@ -433,7 +430,7 @@ const DraggableSidebarItem = memo(function DraggableSidebarItem({
return ( return (
<SidebarItem <SidebarItem
ref={ref} ref={ref}
className={classnames(isDragging && 'opacity-30')} className={classnames(isDragging && 'opacity-20')}
requestName={requestName} requestName={requestName}
requestId={requestId} requestId={requestId}
workspaceId={workspaceId} workspaceId={workspaceId}
@@ -484,7 +481,7 @@ const DropMarker = memo(
function DropMarker() { function DropMarker() {
return ( return (
<div className="relative w-full h-0 overflow-visible pointer-events-none"> <div className="relative w-full h-0 overflow-visible pointer-events-none">
<div className="absolute z-20 left-0 right-0 bottom-[1px] h-[0.2em] bg-blue-300" /> <div className="absolute z-50 left-2 right-2 bottom-[1px] h-[0.2em] bg-blue-500/50 rounded-full" />
</div> </div>
); );
}, },