plane/apps/web/core/hooks/use-resolved-asset-path.tsx

import { useTheme } from "next-themes";

type AssetPathConfig = {
  basePath: string;
  additionalPath?: string;
  extension?: string;
  includeThemeInPath?: boolean;
};

export const useResolvedAssetPath = ({
  basePath,
  additionalPath = "",
  extension = "webp",
  includeThemeInPath = true,
}: AssetPathConfig) => {
  // hooks
  const { resolvedTheme } = useTheme();
  // resolved theme
  const theme = resolvedTheme === "light" ? "light" : "dark";

  if (!includeThemeInPath) {
    return `${additionalPath && additionalPath !== "" ? `${basePath}${additionalPath}` : basePath}.${extension}`;
  }

  return `${additionalPath && additionalPath !== "" ? `${basePath}${additionalPath}` : basePath}-${theme}.${extension}`;
};