guan404ming commented on code in PR #62172:
URL: https://github.com/apache/airflow/pull/62172#discussion_r2833805292


##########
airflow-core/src/airflow/ui/src/layouts/Nav/Nav.tsx:
##########
@@ -100,6 +103,15 @@ export const Nav = () => {
   const { selectedTimezone } = useTimezone();
   const offset = getTimezoneOffsetString(selectedTimezone);
   const tooltipLabel = getTimezoneTooltipLabel(selectedTimezone);
+  const theme = useConfig("theme") as unknown as { icon?: string; 
icon_dark_mode?: string } | undefined;
+
+  // Custom icons handling
+  const { colorMode } = useColorMode();
+  const darkIcon = theme?.icon_dark_mode ?? undefined;
+  const lightIcon = theme?.icon ?? undefined;
+  const iconSrc = colorMode === "dark" && darkIcon !== undefined ? darkIcon : 
lightIcon;
+  const hasIconSrc = Boolean(iconSrc);
+  const [failedLoadingCustomIcon, setFailedLoadingCustomIcon] = useState({ 
dark: false, light: false });

Review Comment:
   I find one edge case here but that is kind of nit. Feel free to skip this.
   
   If only one icon URL is provided (e.g., only icon with no icon_dark_mode), 
and the user switches to dark mode, the fallback logic at line 112 will use 
lightIcon for dark mode too. 
   
   If that fails, it sets `failedLoadingCustomIcon.dark = true`, but the img 
src is actually the light URL. This could lead to the light icon permanently 
failing in dark mode if there's a transient error. Maybe we could consider 
keying by URL rather than color mode, or simplifying since the fallback 
behavior already handles undefined URLs.



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to