🔨 Switch PreferencesButton to use useOvermind (codesandbox#2542)

* 🔨 Switch PreferencesButton to use useOvermind

* Fix types

* Fix types

Author: MichaelDeBoey

packages/app/src/app/pages/Sandbox/Editor/Header/Buttons/PreferencesButton.tsx

@@ -1,14 +1,20 @@
-import React from 'react';
+import React, { FunctionComponent } from 'react';
 import SettingsIcon from 'react-icons/lib/md/settings';
-import { inject, hooksObserver } from 'app/componentConnectors';
+
+import { useOvermind } from 'app/overmind';
+
 import { Action } from './Action';
 
-export const PreferencesButton = inject('signals')(
-  hooksObserver(({ signals: { modalOpened } }) => (
+export const PreferencesButton: FunctionComponent = () => {
+  const {
+    actions: { modalOpened },
+  } = useOvermind();
+
+  return (
     <Action
+      Icon={SettingsIcon}
       onClick={() => modalOpened({ modal: 'preferences' })}
       tooltip="Preferences"
-      Icon={SettingsIcon}
     />
-  ))
-);
+  );
+};