Refactor UI folder (#2016)

* Added Overview page

* Revised Getting Started page

* Minor revision

* Edited readme, minor modifications to docs

* Removed sweep.yaml, .devcontainer, .ergomake

* Moved security.md to .github, added contributing.md

* changes as per code review

* updated contributing.md

* fixed broken links & added missing links in doc, improved structure

* fixed link in wsl setup

* fixed server link, added https cloning in yarn-setup

* removed package-lock.json

* added doc card, admonitions

* removed underline from nav buttons

* refactoring modules/ui

* refactoring modules/ui

* Change folder case

* Fix theme location

* Fix case 2

* Fix storybook

---------

Co-authored-by: Nimra Ahmed <nimra1408@gmail.com>
Co-authored-by: Nimra Ahmed <50912134+nimraahmed@users.noreply.github.com>

front/src/modules/ui/layout/dropdown/hooks/useDropdown.ts

@@ -0,0 +1,65 @@
+import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
+
+import { DropdownScopeInternalContext } from '../scopes/scope-internal-context/DropdownScopeInternalContext';
+
+import { useDropdownStates } from './useDropdownStates';
+
+type UseDropdownProps = {
+  dropdownScopeId?: string;
+};
+
+export const useDropdown = (props?: UseDropdownProps) => {
+  const {
+    setHotkeyScopeAndMemorizePreviousScope,
+    goBackToPreviousHotkeyScope,
+  } = usePreviousHotkeyScope();
+
+  const scopeId = useAvailableScopeIdOrThrow(
+    DropdownScopeInternalContext,
+    props?.dropdownScopeId,
+  );
+
+  const {
+    dropdownHotkeyScope,
+    setDropdownHotkeyScope,
+    isDropdownOpen,
+    setIsDropdownOpen,
+  } = useDropdownStates({
+    scopeId,
+  });
+
+  const closeDropdownButton = () => {
+    goBackToPreviousHotkeyScope();
+    setIsDropdownOpen(false);
+  };
+
+  const openDropdownButton = () => {
+    setIsDropdownOpen(true);
+
+    if (dropdownHotkeyScope) {
+      setHotkeyScopeAndMemorizePreviousScope(
+        dropdownHotkeyScope.scope,
+        dropdownHotkeyScope.customScopes,
+      );
+    }
+  };
+
+  const toggleDropdownButton = () => {
+    if (isDropdownOpen) {
+      closeDropdownButton();
+    } else {
+      openDropdownButton();
+    }
+  };
+
+  return {
+    isDropdownOpen: isDropdownOpen,
+    closeDropdown: closeDropdownButton,
+    toggleDropdown: toggleDropdownButton,
+    openDropdown: openDropdownButton,
+    scopeId,
+    dropdownHotkeyScope,
+    setDropdownHotkeyScope,
+  };
+};