fix: tooltips apart from notes due to floating-ui upgrade

src/components/helpers/tooltip/Tooltip.jsx

@@ -5,9 +5,14 @@ import './tooltip.scss';
 
 function Tooltip({ children, title, style, placement, subtitle }) {
   const [showTooltip, setShowTooltip] = useState(false);
-  const { x, y, reference, floating, strategy } = useFloating({
+  const [reference, setReference] = useState(null);
+
+  const { x, y, refs, strategy } = useFloating({
     placement: placement || 'bottom',
     middleware: [flip(), offset(15), shift()],
+    elements: {
+      reference,
+    },
   });
 
   return (
@@ -19,13 +24,13 @@ function Tooltip({ children, title, style, placement, subtitle }) {
         onMouseLeave={() => setShowTooltip(false)}
         onFocus={() => setShowTooltip(true)}
         onBlur={() => setShowTooltip(false)}
-        ref={reference}
+        ref={setReference}
       >
         {children}
       </div>
       {showTooltip && (
         <span
-          ref={floating}
+          ref={refs.setFloating}
           style={{
             position: strategy,
             top: y ?? '',

src/components/helpers/tooltip/infoTooltip.jsx

@@ -9,17 +9,21 @@ import './tooltip.scss';
 
 function InfoTooltip({ title, style, placement, subtitle }) {
   const [showTooltip, setShowTooltip] = useState(false);
-  const { x, y, reference, floating, strategy } = useFloating({
+  const [reference, setReference] = useState(null);
+  const { x, y, refs, strategy } = useFloating({
     placement: placement || 'top-start',
     middleware: [flip(), offset(10), shift()],
+    elements: {
+      reference,
+    },
   });
 
   return (
-    <div className="infoTooltip" style={style} ref={reference}>
+    <div className="infoTooltip" style={style} ref={setReference}>
       <MdInfo onClick={() => setShowTooltip(true)} />
       {showTooltip && (
         <div
-          ref={floating}
+          ref={refs.setFloating}
           style={{
             position: strategy,
             top: y ?? '',

src/components/widgets/navbar/Notes.jsx

@@ -1,5 +1,5 @@
 import variables from 'modules/variables';
-import { PureComponent, memo } from 'react';
+import { PureComponent, memo, useState } from 'react';
 import PropTypes from 'prop-types';
 
 import { MdContentCopy, MdAssignment, MdPushPin, MdDownload } from 'react-icons/md';
@@ -149,15 +149,21 @@ class Notes extends PureComponent {
 }
 
 function NotesWrapper() {
-  const { x, y, reference, floating, strategy } = useFloating({
+  const [reference, setReference] = useState(null);
+
+  const { x, y, refs, strategy } = useFloating({
     placement: 'bottom',
     middleware: [shift()],
+    elements: {
+      reference,
+    },
   });
 
   return (
     <Notes
-      notesRef={reference}
-      floatRef={floating}
+      notes
+      ref={setReference}
+      floatRef={refs.setFloating}
       position={strategy}
       xPosition={x}
       yPosition={y}

src/components/widgets/navbar/Todo.jsx

@@ -1,5 +1,5 @@
 import variables from 'modules/variables';
-import { PureComponent, memo } from 'react';
+import { PureComponent, memo, useState } from 'react';
 import PropTypes from 'prop-types';
 
 import {
@@ -233,13 +233,18 @@ class Todo extends PureComponent {
 }
 
 function TodoWrapper() {
-  const { x, y, reference, floating, strategy } = useFloating({
+  const [reference, setReference] = useState(null);
+
+  const { x, y, refs, strategy } = useFloating({
     placement: 'bottom',
     middleware: [shift()],
+    elements: {
+      reference,
+    },
   });
 
   return (
-    <Todo todoRef={reference} floatRef={floating} position={strategy} xPosition={x} yPosition={y} />
+    <Todo todoRef={setReference} floatRef={refs.setFloating} position={strategy} xPosition={x} yPosition={y} />
   );
 }