Replace today's hours with Exception hours in Week Formatter

Yes that sounds similar. I ended up doing a hook_preprocess_office_hours and modified the twig template. Basically the gist was in the preprocess, check if an exception exists. If it does, find which day the exception is for and add an exception property to that day of the weeks render array. In the twig file I check if that property exists and if it does display that instead of the normal time slot

{% if item.slots['#markup'] is not empty %}
  <span class="office-hours__item-slots">
    {% if item.exception %}
      {{ item.exception.slots }}
    {% else %}
      {{ item.slots }}
    {% endif %}
  </span>
{% endif %}

I did not think of every use case for this scenario, but in my case this will work because we are open every day of the week. For example, if a day of the week is always closed and the exception is for that day, I dont think that twig condition would work.

Sure, but as I said before I dont think this is super flexible for all cases. I wrote this for our specific needs. It could be a good starting point though.

/**
 * Implements hook_preprocess_office_hours().
 *
 * A normal week with no exceptions is 7 items long, Sunday-Saturday.
 * If there is an exception this array will be longer. Let's figure out
 * which day of the week needs to be overridden. See template for integration.
 *
 * @TODO Array length might not be reliable especially if a day of the week is
 * consistently closed (haven't tested this). Perhaps search for the exception
 * label instead.
 */
function HOOK_preprocess_office_hours(&$vars) {
  $hourLength = count($vars['office_hours']);
  $keys = array_keys($vars['office_hours']);
  if ($hourLength > 7) {
    for ($i = 8; $i < $hourLength; $i++) {
      $key = $keys[$i];
      $dayOverrideKey = date('w', $vars['office_hours'][$key]['day']);
      $vars['items'][$dayOverrideKey]['exception'] = $vars['items'][$i];
    }
  }
}

That code outputs something like this. You can see I have an exception for Tuesday july 4th

^ array:9 [▼
  0 => array:4 [▼
    "label" => "Sunday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  1 => array:4 [▼
    "label" => "Monday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  2 => array:5 [▼
    "label" => "Tuesday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
    "exception" => array:4 [▼
      "label" => "Tuesday, July 4, 2023: "
      "slots" => array:2 [▼
        "#type" => "markup"
        "#markup" => "10:00 am-3:00 pm"
      ]
      "comments" => array:2 [▼
        "#type" => "markup"
        "#markup" => "Closing early for July 4th"
      ]
      "suffix" => "<br />"
    ]
  ]
  3 => array:4 [▼
    "label" => "Wednesday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  4 => array:4 [▼
    "label" => "Thursday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  5 => array:4 [▼
    "label" => "Friday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  6 => array:4 [▼
    "label" => "Saturday: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  7 => array:4 [▼
    "label" => "Exception hours"
    "slots" => array:2 [▶]
    "comments" => array:2 [▶]
    "suffix" => "<br />"
  ]
  8 => array:4 [▼
    "label" => "Tuesday, July 4, 2023: "
    "slots" => array:2 [▶]
    "comments" => array:2 [▼
      "#type" => "markup"
      "#markup" => "Closing early for July 4th"
    ]
    "suffix" => "<br />"
  ]
]

Here is our modified twig template. Aside from showing the exception hours I also change the current day label to read as "TODAY" and we included some collapse functionality that probably should not be included.

{% set id = 'view-hours-' ~ random(1, 50) %}
<button class="view-hours" aria-controls="{{ id }}" aria-expanded="false"><span>View All</span></button>

{% set classes = "office-hours collapse hide office-hours-status--" ~ (is_open ? "open" : "closed") %}
<div{{ attributes.addClass(classes) }} id="{{ id }}">
  {% set today =  'now'|date('w') %}
  {% for key, item in items %}
    {% set currentClass = '' %}
    {% if today == key %}
      {% set currentClass = 'current' %}
    {% endif %}
    <div class="office-hours__item {{ currentClass }}">
      {% if item.label %}
        <span class="office-hours__item-label" style="width: {{ label_length * 0.60 }}em;">
          {% if today == key %}
            Today:
          {% else %}
            {{ item.label }}
          {% endif %}
        </span>
      {% endif %}
      {% if item.slots['#markup'] is not empty %}
        <span class="office-hours__item-slots">
          {% if item.exception %}
            {{ item.exception.slots }}
          {% else %}
            {{ item.slots }}
          {% endif %}
        </span>
      {% endif %}
      {% if item.comments['#markup'] is not empty %}
        <span class="office-hours__item-comments">{{ item.comments }}</span>
      {% endif %}
      {% if item.exception.comments['#markup'] is not empty %}
        <span class="office-hours__item-comments">{{ item.exception.comments }}</span>
      {% endif %}
      <span>{{ item_separator | raw }}</span>
    </div>
  {% endfor %}
</div>

SO you bot want to change the current weekday, AND keep the exception day below the weekdays?

In our case we did not need to display the exception under the current week so I just hid it with CSS.

.office-hours__item:nth-child(n+8) {
  display: none;
}

You can also see this in action here under the photos and center column: https://www.stonebrewing.com/visit/bistros/escondido

We dont currently have an exception on these locations right now. The output above was for our testing on dev.