diff --git a/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillAssetPartitionsTable.tsx b/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillAssetPartitionsTable.tsx
index 7618867991e05..13b006010e6a9 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillAssetPartitionsTable.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillAssetPartitionsTable.tsx
@@ -1,6 +1,7 @@
import {
Box,
ButtonLink,
+ Caption,
Colors,
MiddleTruncate,
NonIdealState,
@@ -170,18 +171,18 @@ export const VirtualizedBackfillPartitionsRow = ({
}) => {
let targeted;
let inProgress;
- let completed;
+ let succeeded;
let failed;
if (asset.__typename === 'AssetPartitionsStatusCounts') {
targeted = asset.numPartitionsTargeted;
inProgress = asset.numPartitionsInProgress;
- completed = asset.numPartitionsMaterialized;
+ succeeded = asset.numPartitionsMaterialized;
failed = asset.numPartitionsFailed;
} else {
targeted = 1;
failed = asset.failed ? 1 : 0;
inProgress = asset.inProgress ? 1 : 0;
- completed = asset.materialized ? 1 : 0;
+ succeeded = asset.materialized ? 1 : 0;
}
const client = useApolloClient();
@@ -218,7 +219,10 @@ export const VirtualizedBackfillPartitionsRow = ({
>
-
+
@@ -233,7 +237,7 @@ export const VirtualizedBackfillPartitionsRow = ({
@@ -242,23 +246,29 @@ export const VirtualizedBackfillPartitionsRow = ({
<>
{numberFormatter.format(targeted)}
{numberFormatter.format(inProgress)}
- {numberFormatter.format(completed)}
+ {numberFormatter.format(succeeded)}
{numberFormatter.format(failed)}
>
) : (
<>
-
- {inProgress ? (
-
- In progress
-
- ) : (
- '-'
- )}
+
+ {inProgress ? (
+
+ In progress
+
+ ) : (
+ '-'
+ )}
+
+
+
+ {succeeded ? Succeeded : '-'}
+
+
+ {failed ? Failed : '-'}
- {completed ? Completed : '-'}
- {failed ? Failed : '-'}
>
)}
@@ -292,32 +302,39 @@ export const BACKFILL_PARTITIONS_FOR_ASSET_KEY_QUERY = gql`
export function StatusBar({
targeted,
inProgress,
- completed,
+ succeeded,
failed,
}: {
targeted: number;
inProgress: number;
- completed: number;
+ succeeded: number;
failed: number;
}) {
+ const pctSucceeded = (100 * succeeded) / targeted;
+ const pctFailed = (100 * failed) / targeted;
+ const pctInProgress = (100 * inProgress) / targeted;
+
+ const pctFinal = Math.ceil(pctSucceeded + pctFailed);
+
return (
-
+
+
+ {`${pctFinal}% completed`}
+
);
}
diff --git a/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillOpJobPartitionsTable.tsx b/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillOpJobPartitionsTable.tsx
index 175f2f5862919..291a5465903b0 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillOpJobPartitionsTable.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/instance/backfill/BackfillOpJobPartitionsTable.tsx
@@ -59,12 +59,12 @@ export const BackfillOpJobPartitionsTable = ({
-
+
diff --git a/js_modules/dagster-ui/packages/ui-core/src/partitions/PartitionStatus.tsx b/js_modules/dagster-ui/packages/ui-core/src/partitions/PartitionStatus.tsx
index b31a4e1729f65..de95fd41ec748 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/partitions/PartitionStatus.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/partitions/PartitionStatus.tsx
@@ -387,9 +387,9 @@ function assetHealthToColorSegments(ranges: Range[]) {
const statusToBackgroundColor = (status: RunStatus | undefined) => {
if (status === undefined) {
- return Colors.accentGray();
+ return Colors.backgroundDisabled();
}
- return status === RunStatus.NOT_STARTED ? Colors.accentGrayHover() : RUN_STATUS_COLORS[status];
+ return status === RunStatus.NOT_STARTED ? Colors.backgroundDisabled() : RUN_STATUS_COLORS[status];
};
function opRunStatusToColorRanges(
diff --git a/js_modules/dagster-ui/packages/ui-core/src/runs/RunsFeedRow.tsx b/js_modules/dagster-ui/packages/ui-core/src/runs/RunsFeedRow.tsx
index 6064977629578..705cc483e113a 100644
--- a/js_modules/dagster-ui/packages/ui-core/src/runs/RunsFeedRow.tsx
+++ b/js_modules/dagster-ui/packages/ui-core/src/runs/RunsFeedRow.tsx
@@ -188,7 +188,7 @@ export const RunsFeedRow = ({
};
const TEMPLATE_COLUMNS =
- '60px minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) 140px 150px 120px 132px';
+ '60px minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) 140px 170px 120px 132px';
export const RunsFeedTableHeader = ({checkbox}: {checkbox: React.ReactNode}) => {
return (
|