Fix type error and adhoc filter alignment

Author: Spikatrix

package.json

@@ -147,7 +147,7 @@
     "@types/papaparse": "5.3.7",
     "@types/pluralize": "^0.0.29",
     "@types/prismjs": "1.26.0",
-    "@types/react": "^18.2.28",
+    "@types/react": "18.2.28",
     "@types/react-beautiful-dnd": "13.1.3",
     "@types/react-datepicker": "^4.19.0",
     "@types/react-dom": "18.2.7",

packages/grafana-ui/src/components/Icon/Icon.tsx

@@ -42,6 +42,9 @@ export const Icon = React.forwardRef<HTMLDivElement, IconProps>(
 
     /* Temporary solution to display also font awesome icons */
     if (name?.startsWith('fa fa-')) {
+      {
+        /* @ts-ignore */
+      }
       return <i className={getFontAwesomeIconStyles(name, className)} {...divElementProps} style={style} />;
     }
 

packages/grafana-ui/src/components/Menu/MenuItem.tsx

@@ -165,16 +165,16 @@ export const MenuItem = React.memo(
           {label}
 
           <div className={cx(styles.rightWrapper, { [styles.withShortcut]: hasShortcut })}>
-            {
-              hasShortcut && (
-                <div className={styles.shortcut}>
-                  <Icon name="keyboard" aria-hidden />
-                  {shortcut}
-                </div>
-              )
-            }
-            {
-              hasSubMenu && (
+            {hasShortcut && (
+              <div className={styles.shortcut}>
+                {/* @ts-ignore */}
+                <Icon name="keyboard" aria-hidden />
+                {shortcut}
+              </div>
+            )}
+            {hasSubMenu && (
+              <>
+                {/* @ts-ignore */}
                 <SubMenu
                   items={childItems}
                   isOpen={isSubMenuOpen}
@@ -183,8 +183,8 @@ export const MenuItem = React.memo(
                   close={closeSubMenu}
                   customStyle={customSubMenuContainerStyles}
                 />
-              )
-            }
+              </>
+            )}
           </div>
         </>
       </ItemElement>

packages/grafana-ui/src/themes/mixins.ts

@@ -40,16 +40,16 @@ export function mediaUp(breakpoint: string) {
   return `only screen and (min-width: ${breakpoint})`;
 }
 
-const isGrafanaTheme2 = (theme: GrafanaTheme | GrafanaTheme2): theme is GrafanaTheme2 => theme.hasOwnProperty('v1');
+// const isGrafanaTheme2 = (theme: GrafanaTheme | GrafanaTheme2): theme is GrafanaTheme2 => theme.hasOwnProperty('v1');
 export const focusCss = (theme: GrafanaTheme | GrafanaTheme2) => {
-  const isTheme2 = isGrafanaTheme2(theme);
+  /* const isTheme2 = isGrafanaTheme2(theme);
   const firstColor = isTheme2 ? theme.colors.background.canvas : theme.colors.bodyBg;
   const secondColor = isTheme2 ? theme.colors.primary.main : theme.colors.formFocusOutline;
+  box-shadow: 0 0 0 2px ${firstColor}, 0 0 0px 4px ${secondColor}; */
 
   return `
   outline: 2px dotted transparent;
   outline-offset: 2px;
-  box-shadow: 0 0 0 2px ${firstColor}, 0 0 0px 4px ${secondColor};
   transition-property: outline, outline-offset, box-shadow;
   transition-duration: 0.2s;
   transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);`;

public/app/features/variables/pickers/PickerRenderer.tsx

@@ -25,6 +25,9 @@ const renderWrapperStyle = css`
     font-size: 12px;
     line-height: 24px;
   }
+  & span {
+    margin-top: 2px;
+  }
 `;
 
 export const PickerRenderer: FunctionComponent<Props> = (props) => {

public/microfrontends/fn_dashboard/index.html

@@ -21,13 +21,13 @@
 
     <script
       nonce=""
-      src="../../../public/build/runtime~fn_dashboard.b6b275367b9723579ba0.js"
+      src="../../../public/build/runtime~fn_dashboard.559158f4ffa2521babc3.js"
       type="text/javascript"
     ></script>
 
     <script
       nonce=""
-      src="../../../public/build/fn_dashboard.7eb8aa16a9bd67ede0fc.js"
+      src="../../../public/build/fn_dashboard.4e992a86e1264e98dfa3.js"
       type="text/javascript"
     ></script>
 

yarn.lock

@@ -11333,7 +11333,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react@npm:*, @types/react@npm:>=16, @types/react@npm:^18.2.28":
+"@types/react@npm:*, @types/react@npm:18.2.28, @types/react@npm:>=16":
   version: 18.2.28
   resolution: "@types/react@npm:18.2.28"
   dependencies:
@@ -19833,7 +19833,7 @@ __metadata:
     "@types/papaparse": 5.3.7
     "@types/pluralize": ^0.0.29
     "@types/prismjs": 1.26.0
-    "@types/react": ^18.2.28
+    "@types/react": 18.2.28
     "@types/react-beautiful-dnd": 13.1.3
     "@types/react-datepicker": ^4.19.0
     "@types/react-dom": 18.2.7