mirror of
https://github.com/chartdb/chartdb.git
synced 2026-02-05 19:18:54 -06:00
update dependencies order (#255)
This commit is contained in:
@@ -48,7 +48,18 @@ export const DependenciesSection: React.FC<DependenciesSectionProps> = () => {
|
||||
dependency
|
||||
) => shouldShowDependencyBySchemaFilter(dependency, filteredSchemas);
|
||||
|
||||
return dependencies.filter(filterSchema).filter(filterName);
|
||||
return dependencies
|
||||
.filter(filterSchema)
|
||||
.filter(filterName)
|
||||
.sort((a, b) => {
|
||||
const dependentTableA = getTable(a.dependentTableId);
|
||||
const tableA = getTable(a.tableId);
|
||||
const dependentTableB = getTable(b.dependentTableId);
|
||||
const tableB = getTable(b.tableId);
|
||||
return `${dependentTableA?.name}${tableA?.name}`.localeCompare(
|
||||
`${dependentTableB?.name}${tableB?.name}`
|
||||
);
|
||||
});
|
||||
}, [dependencies, filterText, filteredSchemas, getTable]);
|
||||
|
||||
return (
|
||||
|
||||
@@ -36,24 +36,6 @@ export const DependencyListItemContent: React.FC<
|
||||
<div className="my-1 flex flex-col rounded-b-md px-1">
|
||||
<div className="flex flex-col gap-6">
|
||||
<div className="flex items-center justify-between gap-1 text-xs">
|
||||
<div className="flex basis-1/2 flex-col gap-2 overflow-hidden text-xs">
|
||||
<div className="flex flex-row items-center gap-1">
|
||||
<FileOutput className="size-4 text-subtitle" />
|
||||
<div className="font-bold text-subtitle">
|
||||
{t(
|
||||
'side_panel.dependencies_section.dependency.table'
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<Tooltip>
|
||||
<TooltipTrigger>
|
||||
<div className="truncate text-left text-sm">
|
||||
{table?.name}
|
||||
</div>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>{table?.name}</TooltipContent>
|
||||
</Tooltip>
|
||||
</div>
|
||||
<div className="flex basis-1/2 flex-col gap-2 overflow-hidden text-xs">
|
||||
<div className="flex flex-row items-center gap-1">
|
||||
<FileMinus2 className="size-4 text-subtitle" />
|
||||
@@ -74,6 +56,24 @@ export const DependencyListItemContent: React.FC<
|
||||
</TooltipContent>
|
||||
</Tooltip>
|
||||
</div>
|
||||
<div className="flex basis-1/2 flex-col gap-2 overflow-hidden text-xs">
|
||||
<div className="flex flex-row items-center gap-1">
|
||||
<FileOutput className="size-4 text-subtitle" />
|
||||
<div className="font-bold text-subtitle">
|
||||
{t(
|
||||
'side_panel.dependencies_section.dependency.table'
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<Tooltip>
|
||||
<TooltipTrigger>
|
||||
<div className="truncate text-left text-sm">
|
||||
{table?.name}
|
||||
</div>
|
||||
</TooltipTrigger>
|
||||
<TooltipContent>{table?.name}</TooltipContent>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-1 items-center justify-center pt-2">
|
||||
|
||||
@@ -39,7 +39,7 @@ export const DependencyListItemHeader: React.FC<
|
||||
return '';
|
||||
}
|
||||
|
||||
return `${table.name} -> ${dependentTable.name}`;
|
||||
return `${dependentTable.name} -> ${table.name}`;
|
||||
}, [dependency.tableId, dependency.dependentTableId, getTable]);
|
||||
|
||||
const focusOnDependency = useCallback(
|
||||
|
||||
Reference in New Issue
Block a user