change usePrevious hook to usePreviousProps; misc cleanup

src/core/Core.js

@@ -100,16 +100,16 @@ export default class Vizality extends Updatable {
        * Vizality's components module inside the managers.
        */
       this.manager = {};
-      const APIManager = require('./managers/API').default;
+      const CommunityManager = require('./managers/Community').default;
       const BuiltinManager = require('./managers/Builtin').default;
       const PluginManager = require('./managers/Plugin').default;
-      // const MarketManager = require('./managers/Market').default;
       const ThemeManager = require('./managers/Theme').default;
-      this.manager.apis = new APIManager();
+      const APIManager = require('./managers/API').default;
+      this.manager.community = new CommunityManager();
       this.manager.builtins = new BuiltinManager();
       this.manager.plugins = new PluginManager();
-      // this.manager.market = new MarketManager();
       this.manager.themes = new ThemeManager();
+      this.manager.apis = new APIManager();
 
       /**
        * Time to start Vizality.

src/core/builtins/dashboard/index.js

@@ -2,26 +2,17 @@
  * 
  */
 
-import SettingsContextMenu from '@vizality/builtins/settings/components/ContextMenu';
+import { SettingsContextMenu } from '@vizality/components/vizality';
 import { getModule, contextMenu } from '@vizality/webpack';
 import { forceUpdateElement } from '@vizality/util/react';
-import { Icon, ContextMenu } from '@vizality/components';
 import { patch, unpatch } from '@vizality/patcher';
 import { Builtin } from '@vizality/entities';
-import React, { memo } from 'react';
+import { Icon } from '@vizality/components';
+import React from 'react';
 
 import Routes from './routes/Routes';
 
-const { closeContextMenu, openContextMenu } = contextMenu;
-
-const VizalitySettingsContextMenu = memo(() => {
-  console.log(SettingsContextMenu.type().props.children[1]);
-  return (
-    <ContextMenu.Menu navId='vizality-dashboard' onClose={closeContextMenu}>
-      {SettingsContextMenu.type().props.children[1].props.children}
-    </ContextMenu.Menu>
-  );
-});
+const { openContextMenu } = contextMenu;
 
 export default class Dashboard extends Builtin {
   /**
@@ -119,7 +110,7 @@ export default class Dashboard extends Builtin {
                 route='/vizality'
                 text='Dashboard'
                 selected={vizality.api.routes.getLocation()?.pathname?.startsWith('/vizality')}
-                onContextMenu={evt => openContextMenu(evt, () => <VizalitySettingsContextMenu />)}
+                onContextMenu={evt => openContextMenu(evt, () => <SettingsContextMenu />)}
               />,
             ...res.props.children.slice(0)
           ];

src/core/modules/hooks/index.js

@@ -175,7 +175,7 @@ export const useForceUpdateWithCallback = callback => {
   }).current;
 };
 
-export const usePrevious = value => {
+export const usePreviousProps = value => {
   /*
    * The ref object is a generic container whose current property is mutable
    * and can hold any value, similar to an instance property on a class.
@@ -225,15 +225,23 @@ export const useToggle = (initialState = false) => {
 };
 
 /**
- * 
- * @param {*} param
- * @returns 
+ * Filters data based on a query, with the option to filter by keys and
+ * includes some other options.
+ * @param {object} filter Filter parameters
+ * @param {Array<string>} filter.data Data
+ * @param {Array<string>|string} [filter.keys] Keys in the data to process
+ * @param {object} [filter.options] Extra filter options
+ * @param {boolean} [options.fuzzy] Whether or not the search should be fuzzy (return results that do not match exactly)
+ * @param {boolean} [options.caseSensitive] Whether or not the search should be case sensitive
+ * @param {boolean} [options.sortByRelevance] Whether or not the search should be sorted by relevance (only applicable if fuzzy option is true)
+ * @param {boolean} [options.exactMatch] Whether or not the search should return exact matches only
  * @example
  * ```
  * const App = () => {
- *   const { inputText, setInputText, filtered } = useFilter({
+ *   const [ inputText, setInputText, filtered ] = useFilter({
  *     keys: [ 'user.name', 'subject', 'dest.name' ],
  *     data: sampleData,
+ * options: 
  *   });
  *
  *   return (
@@ -249,44 +257,16 @@ export const useToggle = (initialState = false) => {
  * };
  * ```
  */
-export const useFilter = ({ keys, data }) => {
+export const useFilter = ({ data, keys, options }) => {
   const [ query, setQuery ] = useState('');
-  const filtered = useMemo(
-    () => data.filter(createFilter(query, keys)),
-    [ data, query ]
-  );
+  const filtered = useMemo(() => data.filter(createFilter(query, keys)), [ data, query, options ]);
   return [ query, setQuery, filtered ];
 };
 
-export const useSticky = ({ defaultSticky = false }) => {
-  const [ sticky, setSticky ] = useState(defaultSticky);
-  const tableRef = useRef(null);
-  const toggleSticky = useCallback(
-    ({ top, bottom }) => {
-      if (top <= 0 && bottom > 2 * 68) {
-        !sticky && setSticky(true);
-      } else {
-        sticky && setSticky(false);
-      }
-    },
-    [ sticky ]
-  );
-  useEffect(() => {
-    const handleScroll = () => {
-      toggleSticky(tableRef.current.getBoundingClientRect());
-    };
-    window.addEventListener('scroll', handleScroll);
-    return () => {
-      window.removeEventListener('scroll', handleScroll);
-    };
-  }, [ toggleSticky ]);
-  return { sticky, setSticky };
-};
-
 /**
- * 
+ *
  * Sourced from @see {@link https://codesandbox.io/s/animate-height-framer-motion-yn59l?file=/src/use-callback-ref.js:48-209}
- * @returns 
+ * @returns
  */
 export const useCallbackRef = () => {
   const [ ref, setRef ] = useState(null);
@@ -297,16 +277,16 @@ export const useCallbackRef = () => {
 };
 
 /**
- * 
+ *
  * Sourced from @see {@link https://codesandbox.io/s/animate-height-framer-motion-yn59l?file=/src/use-measure.js}
- * @returns 
+ * @returns
  */
- export const useMeasure = ref => {
+export const useMeasure = ref => {
   const [ element, attachRef ] = useCallbackRef();
   const [ bounds, setBounds ] = useState({});
 
   useEffect(() => {
-    function onResize([ entry ]) {
+    function onResize ([ entry ]) {
       setBounds({
         height: entry.contentRect.height
       });
@@ -314,7 +294,7 @@ export const useCallbackRef = () => {
 
     const observer = new ResizeObserver(onResize);
 
-    if (element && element.current) {
+    if (element?.current) {
       observer.observe(element.current);
     }
 

src/core/modules/util/Filter.js

@@ -93,7 +93,7 @@ export const createFilter = (term, keys, options = {}) => {
       let currentKeys;
       if (term.indexOf(':') !== -1) {
         const searchedField = term.split(':')[0];
-        term = term.split(':')[1];
+        [ , term ] = term.split(':');
         currentKeys = keys.filter(key => key.toLowerCase().indexOf(searchedField) > -1);
       } else {
         currentKeys = keys;