[codex] fix route detail dropdown clipping (#388)
* fix route detail dropdown clipping * test: refresh proxy route mocks for ci
This commit is contained in:
@@ -0,0 +1,77 @@
|
|||||||
|
import { describe, expect, it, vi } from 'vitest';
|
||||||
|
import { create } from 'react-test-renderer';
|
||||||
|
import { DndContext } from '@dnd-kit/core';
|
||||||
|
import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';
|
||||||
|
import { SortableChannelRow } from './SortableChannelRow.js';
|
||||||
|
import type { RouteChannel } from './types.js';
|
||||||
|
|
||||||
|
function buildChannel(overrides: Partial<RouteChannel> = {}): RouteChannel {
|
||||||
|
return {
|
||||||
|
id: 301,
|
||||||
|
routeId: 88,
|
||||||
|
accountId: 7,
|
||||||
|
tokenId: null,
|
||||||
|
sourceModel: 'gpt-4.1',
|
||||||
|
priority: 0,
|
||||||
|
weight: 100,
|
||||||
|
enabled: true,
|
||||||
|
manualOverride: true,
|
||||||
|
successCount: 12,
|
||||||
|
failCount: 1,
|
||||||
|
cooldownUntil: null,
|
||||||
|
account: {
|
||||||
|
username: 'cc',
|
||||||
|
accessToken: null,
|
||||||
|
extraConfig: null,
|
||||||
|
credentialMode: 'oauth',
|
||||||
|
},
|
||||||
|
site: {
|
||||||
|
id: 99,
|
||||||
|
name: 'codelab',
|
||||||
|
platform: 'openai',
|
||||||
|
},
|
||||||
|
token: null,
|
||||||
|
...overrides,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
describe('SortableChannelRow layering', () => {
|
||||||
|
it('does not force a base z-index on desktop rows when they are not being dragged', () => {
|
||||||
|
const channel = buildChannel();
|
||||||
|
const root = create(
|
||||||
|
<DndContext>
|
||||||
|
<SortableContext items={[channel.id]} strategy={verticalListSortingStrategy}>
|
||||||
|
<SortableChannelRow
|
||||||
|
channel={channel}
|
||||||
|
decisionCandidate={undefined}
|
||||||
|
isExactRoute
|
||||||
|
loadingDecision={false}
|
||||||
|
isSavingPriority={false}
|
||||||
|
tokenOptions={[
|
||||||
|
{
|
||||||
|
id: 501,
|
||||||
|
name: 'shared-token',
|
||||||
|
isDefault: true,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
activeTokenId={0}
|
||||||
|
isUpdatingToken={false}
|
||||||
|
onTokenDraftChange={vi.fn()}
|
||||||
|
onSaveToken={vi.fn()}
|
||||||
|
onDeleteChannel={vi.fn()}
|
||||||
|
onToggleEnabled={vi.fn()}
|
||||||
|
onSiteBlockModel={vi.fn()}
|
||||||
|
/>
|
||||||
|
</SortableContext>
|
||||||
|
</DndContext>,
|
||||||
|
);
|
||||||
|
|
||||||
|
const row = root.root.find((node) => (
|
||||||
|
node.type === 'div'
|
||||||
|
&& node.props.style
|
||||||
|
&& node.props.style.borderLeft === '2px solid var(--color-primary)'
|
||||||
|
));
|
||||||
|
|
||||||
|
expect(row.props.style.zIndex).toBeUndefined();
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -51,7 +51,7 @@ export function SortableChannelRow({
|
|||||||
transform: CSS.Transform.toString(transform),
|
transform: CSS.Transform.toString(transform),
|
||||||
transition,
|
transition,
|
||||||
opacity: isDragging ? 0.72 : channel.enabled === false ? 0.5 : 1,
|
opacity: isDragging ? 0.72 : channel.enabled === false ? 0.5 : 1,
|
||||||
zIndex: isDragging ? 10 : 1,
|
zIndex: isDragging ? 10 : undefined,
|
||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: managementLocked || mobile ? 'minmax(0, 1fr)' : 'minmax(0, 1fr) auto auto auto',
|
gridTemplateColumns: managementLocked || mobile ? 'minmax(0, 1fr)' : 'minmax(0, 1fr) auto auto auto',
|
||||||
alignItems: mobile ? 'stretch' : 'center',
|
alignItems: mobile ? 'stretch' : 'center',
|
||||||
|
|||||||
Reference in New Issue
Block a user