feat: add autonext status to piece part counter

Author: olzzon

packages/webui/src/client/styles/countdown/director.scss

@@ -214,17 +214,31 @@ $hold-status-color: $liveline-timecode-color;
 						'YTLC' 514, 'YTUC' 712, 'opsz' 120, 'slnt' 0, 'wdth' 70, 'wght' 500;
 					padding: 0 0.1em;
 					line-height: 1em;
+					display: flex;
+					align-items: center;
 
 					> .overtime {
 						color: $general-late-color;
 						font-variation-settings: 'GRAD' 0, 'XOPQ' 96, 'XTRA' 468, 'YOPQ' 79, 'YTAS' 750, 'YTDE' -203, 'YTFI' 738,
 							'YTLC' 514, 'YTUC' 712, 'opsz' 100, 'slnt' 0, 'wdth' 70, 'wght' 600;
 					}
 
+					.auto-next-status {
+						font-size: 0.5em;
+						margin-left: 0.2em;
+						margin-top: -4vh;
+						color: $general-next-color;
+						font-variation-settings: 'GRAD' 0, 'XOPQ' 96, 'XTRA' 468, 'YOPQ' 79, 'YTAS' 750, 'YTDE' -203, 'YTFI' 738,
+							'YTLC' 514, 'YTUC' 712, 'opsz' 100, 'slnt' -20, 'wdth' 70, 'wght' 600;
+					}
+
 					.freeze-counter {
 						color: #00bfff;
 						margin-left: 4vw;
+						display: flex;
+						align-items: center;
 					}
+
 					img.freeze-counter-icon {
 						margin-top: -0.3em;
 						width: 1em;

packages/webui/src/client/ui/ClockView/DirectorScreen.tsx

@@ -43,6 +43,7 @@ import {
 	TimeToPlannedEndComponent,
 } from '../../lib/Components/CounterComponents'
 import { AdjustLabelFit } from '../util/AdjustLabelFit'
+import { AutoNextStatus } from '../RundownView/RundownTiming/AutoNextStatus'
 
 interface SegmentUi extends DBSegment {
 	items: Array<PartUi>
@@ -453,7 +454,10 @@ function DirectorScreenRender({
 										<CurrentPartOrSegmentRemaining
 											currentPartInstanceId={playlist.currentPartInfo?.partInstanceId ?? null}
 											heavyClassName="overtime"
-										/>{' '}
+										/>
+										<span className="auto-next-status">
+											<AutoNextStatus />
+										</span>{' '}
 										<span className="freeze-counter">
 											<PieceFreezeContainer
 												partInstanceId={currentPartInstance.instance._id}