[6.x] Restructure frontend: adopt common/ + modules/ pattern

resources/js/bootstrap/cp.ts

@@ -1,19 +1,19 @@
 import {QueueService, ConfigService} from '@craftcms/cp';
 import {createInertiaApp, router} from '@inertiajs/vue3';
-import QueueManager from '@/components/utilities/QueueManager/QueueManager.vue';
-import {Axios, Config, Queue} from '@/types/keys';
+import QueueManager from '@/modules/utilities/components/queue-manager/QueueManager.vue';
+import {Axios, Config, Queue} from '@/common/types/keys';
 import axios from 'axios';
-import QueueManagerToolbar from '@/components/utilities/QueueManager/QueueManagerToolbar.vue';
-import DeprecationErrors from '@/components/utilities/DeprecationErrors/DeprecationErrors.vue';
-import ClearCaches from '@/components/utilities/ClearCaches/ClearCaches.vue';
-import FindReplace from '@/components/utilities/FindReplace/FindReplace.vue';
-import DatabaseBackup from '@/components/utilities/DatabaseBackup.vue';
-import Migrations from '@/components/utilities/Migrations.vue';
-import Updates from '@/components/utilities/Updates/Updates.vue';
-import ProjectConfig from '@/components/utilities/ProjectConfig/ProjectConfig.vue';
-import AssetIndexes from '@/components/utilities/AssetIndexes/AssetIndexes.vue';
-import SystemMessages from '@/components/utilities/SystemMessages/SystemMessages.vue';
-import DeprecationErrorsToolbar from '@/components/utilities/DeprecationErrors/DeprecationErrorsToolbar.vue';
+import QueueManagerToolbar from '@/modules/utilities/components/queue-manager/QueueManagerToolbar.vue';
+import DeprecationErrors from '@/modules/utilities/components/deprecation-errors/DeprecationErrors.vue';
+import ClearCaches from '@/modules/utilities/components/clear-caches/ClearCaches.vue';
+import FindReplace from '@/modules/utilities/components/find-replace/FindReplace.vue';
+import DatabaseBackup from '@/modules/utilities/components/DatabaseBackup.vue';
+import Migrations from '@/modules/utilities/components/Migrations.vue';
+import Updates from '@/modules/updater/components/Updates.vue';
+import ProjectConfig from '@/modules/utilities/components/project-config/ProjectConfig.vue';
+import AssetIndexes from '@/modules/utilities/components/asset-indexes/AssetIndexes.vue';
+import SystemMessages from '@/modules/utilities/components/system-messages/SystemMessages.vue';
+import DeprecationErrorsToolbar from '@/modules/utilities/components/deprecation-errors/DeprecationErrorsToolbar.vue';
 import {setTranslations} from '@craftcms/cp/utilities/translate.ts.mjs';
 
 let bootedCallbacks: Array<(instance: any) => void> = [];

resources/js/components/Breadcrumbs.vue → resources/js/common/components/Breadcrumbs.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import CpLink from '@/components/CpLink.vue';
+  import CpLink from '@/common/components/CpLink.vue';
   import {t} from '@craftcms/cp';
 
   withDefaults(

resources/js/components/CpSidebar.vue → resources/js/common/components/CpSidebar.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
   import {t} from '@craftcms/cp';
-  import SystemInfo from '@/components/SystemInfo.vue';
-  import MainNav from '@/components/MainNav.vue';
-  import EditionInfo from '@/components/EditionInfo.vue';
-  import DevModeIndicator from '@/components/DevModeIndicator.vue';
+  import SystemInfo from '@/common/components/SystemInfo.vue';
+  import MainNav from '@/common/components/MainNav.vue';
+  import EditionInfo from '@/common/components/EditionInfo.vue';
+  import DevModeIndicator from '@/common/components/DevModeIndicator.vue';
   import {computed, nextTick, watch} from 'vue';
 
   const emit = defineEmits<{

resources/js/components/CurrentUser.vue → resources/js/common/components/CurrentUser.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-  import useCraftData from '@/composables/useCraftData';
-  import UserThumbnail from '@/components/UserThumbnail.vue';
+  import useCraftData from '@/common/composables/useCraftData';
+  import UserThumbnail from '@/common/components/UserThumbnail.vue';
   import {computed} from 'vue';
   import UsersController from '@actions/Users/UsersController';
 

resources/js/components/DropIndicator.vue → resources/js/common/components/DropIndicator.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
   import type {Edge} from '@atlaskit/pragmatic-drag-and-drop-hitbox/types';
-  import VarDump from '@/components/VarDump.vue';
+  import VarDump from '@/common/components/VarDump.vue';
 
   const props = defineProps<{
     edge?: Edge | null;

resources/js/components/EditionInfo.vue → resources/js/common/components/EditionInfo.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import useCraftData from '@/composables/useCraftData';
+  import useCraftData from '@/common/composables/useCraftData';
   import {computed} from 'vue';
 
   const {app, cpUrl} = useCraftData();

resources/js/components/FlashMessages.vue → resources/js/common/components/FlashMessages.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
   import {computed, watch} from 'vue';
   import {usePage} from '@inertiajs/vue3';
-  import {useFlashMessages} from '@/composables/useFlashMessages';
-  import {useAnnouncer} from '@/composables/useAnnouncer';
+  import {useFlashMessages} from '@/common/composables/useFlashMessages';
+  import {useAnnouncer} from '@/common/composables/useAnnouncer';
 
   const {messages} = useFlashMessages();
   const {announce} = useAnnouncer();

resources/js/components/InlineFlash.vue → resources/js/common/components/InlineFlash.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-  import TransitionFade from '@/components/TransitionFade.vue';
-  import {useFlash} from '@/composables/useFlash';
+  import TransitionFade from '@/common/components/TransitionFade.vue';
+  import {useFlash} from '@/common/composables/useFlash';
 
   withDefaults(
     defineProps<{

resources/js/components/LiveRegion.vue → resources/js/common/components/LiveRegion.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-  import {useAnnouncer} from '@/composables/useAnnouncer';
-  import TransitionFade from '@/components/TransitionFade.vue';
+  import {useAnnouncer} from '@/common/composables/useAnnouncer';
+  import TransitionFade from '@/common/components/TransitionFade.vue';
 
   const {announcement} = useAnnouncer();
 </script>

resources/js/components/MainNav.vue → resources/js/common/components/MainNav.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import useCraftData from '@/composables/useCraftData';
+  import useCraftData from '@/common/composables/useCraftData';
   import {computed} from 'vue';
   import {usePage} from '@inertiajs/vue3';
 

resources/js/components/ModalForm.vue → resources/js/common/components/ModalForm.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
   import {t} from '@craftcms/cp';
-  import Modal, {type ModalProps} from '@/components/Modal.vue';
-  import Pane from '@/components/Pane.vue';
+  import Modal, {type ModalProps} from '@/common/components/Modal.vue';
+  import Pane from '@/common/components/Pane.vue';
 
   const emit = defineEmits<{
     (e: 'close'): void;

resources/js/components/SystemInfo.vue → resources/js/common/components/SystemInfo.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import useCraftData from '@/composables/useCraftData';
+  import useCraftData from '@/common/composables/useCraftData';
   import {computed} from 'vue';
 
   const craftData = useCraftData();

resources/js/components/UserMenu.vue → resources/js/common/components/UserMenu.vue

@@ -4,11 +4,11 @@
   import PermissionsController from '@actions/Users/PermissionsController';
   import PreferencesController from '@actions/Users/PreferencesController';
   import UsersController from '@actions/Users/UsersController';
-  import useCraftData from '@/composables/useCraftData';
+  import useCraftData from '@/common/composables/useCraftData';
   import {computed} from 'vue';
-  import ActionMenu from '@/components/ActionMenu.vue';
-  import CurrentUser from '@/components/CurrentUser.vue';
-  import UserThumbnail from '@/components/UserThumbnail.vue';
+  import ActionMenu from '@/common/components/ActionMenu.vue';
+  import CurrentUser from '@/common/components/CurrentUser.vue';
+  import UserThumbnail from '@/common/components/UserThumbnail.vue';
   import PasswordController from '@actions/Users/PasswordController';
 
   const {currentUser, general} = useCraftData();

resources/js/components/UserThumbnail.vue → resources/js/common/components/UserThumbnail.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import useCraftData from '@/composables/useCraftData';
+  import useCraftData from '@/common/composables/useCraftData';
   import {computed} from 'vue';
 
   const {currentUser} = useCraftData();

resources/js/composables/useFetch.ts → resources/js/common/composables/useFetch.ts

@@ -14,7 +14,7 @@ import axios, {
   type AxiosResponse,
   type CancelTokenSource,
 } from 'axios';
-import {useHelpers} from '@/composables/useCraftData';
+import {useHelpers} from '@/common/composables/useCraftData';
 import {apiClient} from '@craftcms/cp/utilities/api/apiClient.ts.mjs';
 
 // Type for URL parameter - can be string, ref, or computed

resources/js/components/form/CheckboxGroup.vue → resources/js/common/form/CheckboxGroup.vue

@@ -2,7 +2,7 @@
   import {t} from '@craftcms/cp/utilities/translate.ts';
   import {computed} from 'vue';
   import type CraftCheckbox from '@craftcms/cp/components/checkbox/checkbox.ts.mjs';
-  import type {CheckboxOption} from '@/types';
+  import type {CheckboxOption} from '@/common/types';
 
   const emit = defineEmits<{
     (e: 'update:modelValue', value: Array<string>): void;

resources/js/components/form/CraftCombobox.vue → resources/js/common/form/CraftCombobox.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
   import {t} from '@craftcms/cp';
-  import InputCombobox from '@/components/form/InputCombobox.vue';
-  import type {SelectItem} from '@/types';
+  import InputCombobox from '@/common/form/InputCombobox.vue';
+  import type {SelectItem} from '@/common/types';
   import {computed, useSlots} from 'vue';
 
   const modelValue = defineModel<string | number | boolean>();

resources/js/components/form/InputCombobox.vue → resources/js/common/form/InputCombobox.vue

@@ -14,8 +14,8 @@
     ComboboxOptions,
     TransitionRoot,
   } from '@headlessui/vue';
-  import type {SelectItem, SelectOption} from '@/types';
-  import InputComboboxOption from '@/components/form/InputComboboxOption.vue';
+  import type {SelectItem, SelectOption} from '@/common/types';
+  import InputComboboxOption from '@/common/form/InputComboboxOption.vue';
 
   const emit = defineEmits<{
     (e: 'update:modelValue', value: string | number): void;

resources/js/components/form/InputComboboxOption.vue → resources/js/common/form/InputComboboxOption.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
   import {ComboboxOption} from '@headlessui/vue';
-  import type {SelectOption} from '@/types';
+  import type {SelectOption} from '@/common/types';
 
   defineProps<{
     option: SelectOption;

resources/js/components/form/Select.vue → resources/js/common/form/Select.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import type {BaseOption} from '@/types';
+  import type {BaseOption} from '@/common/types';
   import CraftSelect from '@craftcms/cp/vue/CraftSelect.vue';
   import {computed} from 'vue';
 

resources/js/layout/AppLayout.vue → resources/js/common/layouts/AppLayout.vue

@@ -1,25 +1,25 @@
 <script setup lang="ts">
-  import SystemInfo from '@/components/SystemInfo.vue';
-  import useCraftData from '@/composables/useCraftData';
+  import SystemInfo from '@/common/components/SystemInfo.vue';
+  import useCraftData from '@/common/composables/useCraftData';
   import {t} from '@craftcms/cp/utilities/translate.ts.mjs';
   import {computed, reactive, ref, useTemplateRef, watch} from 'vue';
-  import CpSidebar from '@/components/CpSidebar.vue';
+  import CpSidebar from '@/common/components/CpSidebar.vue';
   import {useMediaQuery} from '@vueuse/core';
   import {Head, type InertiaForm, usePage} from '@inertiajs/vue3';
-  import VarDump from '@/components/VarDump.vue';
-  import Breadcrumbs from '@/components/Breadcrumbs.vue';
-  import {useAnnouncer} from '@/composables/useAnnouncer';
-  import LiveRegion from '@/components/LiveRegion.vue';
-  import {useAppendHtml} from '@/composables/useAppendHtml';
-  import ActionMenu from '@/components/ActionMenu.vue';
-  import type {ActionItemData} from '@/types';
-  import {useFlash} from '@/composables/useFlash';
-  import InlineFlash from '@/components/InlineFlash.vue';
-  import ErrorSummary from '@/components/form/ErrorSummary.vue';
-  import CalloutReadOnly from '@/components/CalloutReadOnly.vue';
-  import {useFlashMessages} from '@/composables/useFlashMessages';
-  import UserMenu from '@/components/UserMenu.vue';
-  import FlashMessages from '@/components/FlashMessages.vue';
+  import VarDump from '@/common/components/VarDump.vue';
+  import Breadcrumbs from '@/common/components/Breadcrumbs.vue';
+  import {useAnnouncer} from '@/common/composables/useAnnouncer';
+  import LiveRegion from '@/common/components/LiveRegion.vue';
+  import {useAppendHtml} from '@/common/composables/useAppendHtml';
+  import ActionMenu from '@/common/components/ActionMenu.vue';
+  import type {ActionItemData} from '@/common/types';
+  import {useFlash} from '@/common/composables/useFlash';
+  import InlineFlash from '@/common/components/InlineFlash.vue';
+  import ErrorSummary from '@/common/form/ErrorSummary.vue';
+  import CalloutReadOnly from '@/common/components/CalloutReadOnly.vue';
+  import {useFlashMessages} from '@/common/composables/useFlashMessages';
+  import UserMenu from '@/common/components/UserMenu.vue';
+  import FlashMessages from '@/common/components/FlashMessages.vue';
 
   interface SaveOptions {
     redirect?: boolean;

resources/js/layout/AuthBase.vue → resources/js/common/layouts/AuthBase.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-  import useCraftData from '@/composables/useCraftData';
+  import useCraftData from '@/common/composables/useCraftData';
 
   const {general, system} = useCraftData();
 </script>

resources/js/layout/IndexLayout.vue → resources/js/common/layouts/IndexLayout.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
   import {t} from '@craftcms/cp';
-  import AppLayout, {type AppLayoutProps} from '@/layout/AppLayout.vue';
+  import AppLayout, {type AppLayoutProps} from '@/common/layouts/AppLayout.vue';
   import {computed, ref, useSlots, watch} from 'vue';
   import {useMediaQuery} from '@vueuse/core';
 

resources/js/utils/transformBooleanOptions.ts → resources/js/common/utils/transformBooleanOptions.ts

@@ -1,5 +1,5 @@
 import {t} from '@craftcms/cp';
-import type {SelectItem, SelectOption} from '@/types';
+import type {SelectItem, SelectOption} from '@/common/types';
 
 function addBooleanData(
   option: SelectOption,

resources/js/components/AdminTable/AdminTable.vue → resources/js/modules/admin-table/components/AdminTable.vue

@@ -2,14 +2,14 @@
   import {type Column, FlexRender} from '@tanstack/vue-table';
   import {t} from '@craftcms/cp/utilities/translate.ts.mjs';
   import {computed, useId} from 'vue';
-  import {useReorderableRows} from '@/composables/useReorderableRows';
-  import {TableSpacing, type TableSpacingValue} from '@/types';
-  import ColumnHeaderTitle from '@/components/AdminTable/ColumnHeaderTitle.vue';
-  import ReorderButton from '@/components/ReorderButton.vue';
-  import DropIndicator from '@/components/DropIndicator.vue';
-  import Select from '@/components/form/Select.vue';
-  import Text from '@/components/Text.vue';
-  import Empty from '@/components/Empty.vue';
+  import {useReorderableRows} from '@/modules/admin-table/composables/useReorderableRows';
+  import {TableSpacing, type TableSpacingValue} from '@/common/types';
+  import ColumnHeaderTitle from '@/modules/admin-table/components/ColumnHeaderTitle.vue';
+  import ReorderButton from '@/common/components/ReorderButton.vue';
+  import DropIndicator from '@/common/components/DropIndicator.vue';
+  import Select from '@/common/form/Select.vue';
+  import Text from '@/common/components/Text.vue';
+  import Empty from '@/common/components/Empty.vue';
 
   const props = withDefaults(
     defineProps<{

resources/js/composables/useEditableTable.ts → resources/js/modules/admin-table/composables/useEditableTable.ts

@@ -9,9 +9,9 @@ import {
   useVueTable,
 } from '@tanstack/vue-table';
 import CraftSwitch from '@craftcms/cp/vue/CraftSwitch.vue';
-import InputCombobox from '@/components/form/InputCombobox.vue';
-import type {SelectItem, SelectOption} from '@/types';
-import useCraftData from '@/composables/useCraftData';
+import InputCombobox from '@/common/form/InputCombobox.vue';
+import type {SelectItem, SelectOption} from '@/common/types';
+import useCraftData from '@/common/composables/useCraftData';
 
 type MaybeGetter<T> = T | (() => T);
 

resources/js/composables/useServerPagination.ts → resources/js/modules/admin-table/composables/useServerPagination.ts

@@ -4,7 +4,7 @@ import type {
   TableOptionsWithReactiveData,
   Updater,
 } from '@tanstack/vue-table';
-import type {PaginationData} from '@/types';
+import type {PaginationData} from '@/common/types';
 
 interface OnChangeArgs {
   state: PaginationState;

resources/js/composables/useServerSort.ts → resources/js/modules/admin-table/composables/useServerSort.ts

@@ -1,6 +1,6 @@
 import {ref} from 'vue';
 import type {SortingState, Updater} from '@tanstack/vue-table';
-import type {SortItem} from '@/types';
+import type {SortItem} from '@/common/types';
 
 interface OnChangeArgs {
   state: SortingState;

resources/js/components/AdminTable/createCraftColumnHelper.ts → resources/js/modules/admin-table/helpers/createCraftColumnHelper.ts

@@ -8,9 +8,9 @@ import {
   createColumnHelper,
   type DisplayColumnDef,
 } from '@tanstack/vue-table';
-import type {AccessorParam} from '@/composables/useEditableTable';
-import CpLink from '@/components/CpLink.vue';
-import Date from '@/components/Date.vue';
+import type {AccessorParam} from '@/modules/admin-table/composables/useEditableTable';
+import CpLink from '@/common/components/CpLink.vue';
+import Date from '@/common/components/Date.vue';
 
 type LinkColumnDef<T extends Record<string, any>> = DisplayColumnDef<T> & {
   props: (cellContext: CellContext<T, any>) => Record<string, any>;

resources/js/types/auth.ts → resources/js/modules/auth/types/auth.ts

@@ -1,4 +1,4 @@
-import type {User} from '@/types/user';
+import type {User} from '@/modules/user/types/user';
 
 export interface LoginResponse {
   returnUrl: string;

resources/js/components/EntryType/EntryTypeChip.vue → resources/js/modules/entry-types/components/EntryTypeChip.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-  import ActionMenu from '@/components/ActionMenu.vue';
-  import ReorderButton from '@/components/ReorderButton.vue';
-  import type {EntryType} from '@/types';
-  import Tooltip from '@/components/Tooltip/Tooltip.vue';
+  import ActionMenu from '@/common/components/ActionMenu.vue';
+  import ReorderButton from '@/common/components/ReorderButton.vue';
+  import type {EntryType} from '@/common/types';
+  import Tooltip from '@/common/components/Tooltip.vue';
   import {ref, watch} from 'vue';
 
   const emit = defineEmits<{

resources/js/components/form/EntryTypeSelect.vue → resources/js/modules/entry-types/components/EntryTypeSelect.vue

@@ -1,21 +1,21 @@
 <script setup lang="ts">
-  import type {EntryType} from '@/types';
+  import type {EntryType} from '@/common/types';
   import {computed, ref} from 'vue';
   import {appendBodyHtml, appendHeadHtml, t} from '@craftcms/cp';
   import CraftInput from '@craftcms/cp/vue/CraftInput.vue';
-  import Text from '@/components/Text.vue';
+  import Text from '@/common/components/Text.vue';
   import {
     applyOverrideSettings,
     renderOverrideSettings,
   } from '@actions/Settings/EntryTypesController';
-  import type {SlideoutInstance} from '@/types/globals';
-  import EntryTypeChip from '@/components/EntryType/EntryTypeChip.vue';
-  import CreateEntryTypeButton from '@/components/EntryType/CreateEntryTypeButton.vue';
+  import type {SlideoutInstance} from '@/common/types/globals';
+  import EntryTypeChip from '@/modules/entry-types/components/EntryTypeChip.vue';
+  import CreateEntryTypeButton from '@/modules/entry-types/components/CreateEntryTypeButton.vue';
   import {router} from '@inertiajs/vue3';
-  import DragShadow from '@/components/DragShadow.vue';
-  import {useReorderableItems} from '@/composables/useReorderableItems';
-  import ReorderButton from '@/components/ReorderButton.vue';
-  import useCraftData from '@/composables/useCraftData';
+  import DragShadow from '@/common/components/DragShadow.vue';
+  import {useReorderableItems} from '@/common/composables/useReorderableItems';
+  import ReorderButton from '@/common/components/ReorderButton.vue';
+  import useCraftData from '@/common/composables/useCraftData';
 
   const emit = defineEmits<{
     (e: 'update:modelValue', value: Array<EntryType>): void;

resources/js/components/install/AccountFields.vue → resources/js/modules/install/components/AccountFields.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
   import {t} from '@craftcms/cp';
   import {computed} from 'vue';
-  import {useFocusField} from '@/composables/useFocusField';
+  import {useFocusField} from '@/common/composables/useFocusField';
   import CraftInput from '@craftcms/cp/vue/CraftInput.vue';
   import CraftInputPassword from '@craftcms/cp/vue/CraftInputPassword.vue';
   import {usePage} from '@inertiajs/vue3';