Display a neutral warning icon if version check is disabled

Extend he WarningIcon template to allow custom coloring with fallback
to theme's "warningIcon" color. If version check is disabled, show a
corresponding info with a "infoIcon" (gray) colored icon instead.

Author: stklcode

frontend/src/components/Version/Version.tsx

@@ -3,6 +3,7 @@ import WarningIcon from 'components/common/Icons/WarningIcon';
 import { gitCommitPath } from 'lib/paths';
 import { useLatestVersion } from 'lib/hooks/api/latestVersion';
 import { formatTimestamp } from 'lib/dateTimeHelpers';
+import { useTheme } from 'styled-components';
 
 import * as S from './Version.styled';
 
@@ -17,8 +18,15 @@ const Version: React.FC = () => {
       ? versionTag
       : formatTimestamp(buildTime);
 
+  const theme = useTheme();
+
   return (
     <S.Wrapper>
+      {isLatestRelease === null && (
+        <S.OutdatedWarning title="Version check disabled.">
+          <WarningIcon color={theme.icons.infoIcon} />
+        </S.OutdatedWarning>
+      )}
       {isLatestRelease === false && (
         <S.OutdatedWarning
           title={`Your app version is outdated. Latest version is ${

frontend/src/components/common/Icons/WarningIcon.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import styled from 'styled-components';
+import styled, { useTheme } from 'styled-components';
 
 const WarningIconContainer = styled.span`
   align-items: center;
@@ -9,7 +9,8 @@ const WarningIconContainer = styled.span`
   width: 1.5rem;
 `;
 
-const WarningIcon: React.FC = () => {
+const WarningIcon: React.FC<{ color?: string }> = ({ color }) => {
+  const theme = useTheme();
   return (
     <WarningIconContainer>
       <svg
@@ -24,7 +25,7 @@ const WarningIcon: React.FC = () => {
           fillRule="evenodd"
           clipRule="evenodd"
           d="M8.09265 1.06679C7.60703 0.250524 6.39297 0.250524 5.90735 1.06679L0.170916 10.7089C-0.314707 11.5252 0.292322 12.5455 1.26357 12.5455H12.7364C13.7077 12.5455 14.3147 11.5252 13.8291 10.7089L8.09265 1.06679ZM6 5.00006C6 4.44778 6.44772 4.00006 7 4.00006C7.55228 4.00006 8 4.44778 8 5.00006V7.00006C8 7.55235 7.55228 8.00006 7 8.00006C6.44772 8.00006 6 7.55235 6 7.00006V5.00006ZM6 10.0001C6 9.44778 6.44772 9.00006 7 9.00006C7.55228 9.00006 8 9.44778 8 10.0001C8 10.5523 7.55228 11.0001 7 11.0001C6.44772 11.0001 6 10.5523 6 10.0001Z"
-          fill="#F2C94C"
+          fill={color || theme.icons.warningIcon}
         />
       </svg>
     </WarningIconContainer>