D.T Home Screen Migration Into Core Theme (#2785)

* Add Home Screen Magic Link App functionality

                - Introduced a new Home Screen Magic Link App, including main loader and dashboard template.
                - Implemented CRUD operations for custom apps and training videos management.
                - Added admin interface for managing settings and content.
                - Integrated frontend styles and scripts for a responsive user experience.
                - Updated functions.php to load the new app components.
                - Created README documentation for usage and features.

* Enhance Magic Link App functionality

                - Commented out debug logging in the magic link home app to reduce console clutter.
                - Enriched coded magic-link app URLs in the home apps class, ensuring proper URL generation for user-created apps.
                - Updated sorting logic to operate on the enriched app list instead of the original list.

* Refactor code for consistency and readability

                - Standardized whitespace and formatting in various files, including the home loader, magic link app, admin settings, and training management classes.
                - Enhanced nonce verification by adding wp_unslash to ensure proper handling of submitted data.
                - Improved debug logging statements for better clarity and consistency in error messages.

* Enhance nonce verification and clean up whitespace

                                - Improved security by adding sanitize_text_field to nonce verification in admin form submissions for screen settings, app actions, and video actions.
                                - Added nonce verification checks in the respective handler methods to ensure security before processing actions.
                                - Removed unnecessary whitespace in the magic link home app and training class files for better code readability.

* Refactor admin.js for improved readability and functionality

                - Enhanced the structure and formatting of the admin.js file for better consistency and clarity.
                - Streamlined event handler functions for managing app and video edits, including improved form handling and validation.
                - Added comments to clarify the purpose of functions and improve maintainability.
                - Ensured that required attributes are managed correctly when forms are shown or hidden.

* Implement drag-and-drop reordering for apps and videos in admin interface

                - Added AJAX handlers for reordering apps and training videos, enhancing user experience with drag-and-drop functionality.
                - Updated the admin interface to support sortable tables, including visual feedback during drag operations.
                - Enhanced CSS styles for drag-and-drop elements to improve usability and responsiveness.
                - Refactored the reorder logic in the home apps and training classes to accommodate new ordering mechanism.
                - Introduced a new SortableTable class in admin.js to manage drag-and-drop interactions effectively.

* Refactor admin.js for improved readability and consistency

                - Cleaned up whitespace and formatting throughout the admin.js file to enhance code clarity.
                - Standardized the structure of function calls and improved the readability of the drag-and-drop logic.
                - Ensured consistent use of arrow functions and improved the handling of drop indicators during drag operations.

* Enhance icon management in admin interface

                                - Added an icon selector dialog for easier icon selection in app forms.
                                - Implemented live preview of selected icons in the app creation and editing forms.
                                - Updated JavaScript to handle icon input changes and improve user experience.
                                - Enhanced CSS styles for icon display and button interactions.
                                - Refactored admin.js to streamline event handling for icon changes.

* Refactor home-admin.php for improved script management

                - Cleaned up whitespace in the home-admin.php file for better readability.
                - Ensured proper enqueueing of scripts and styles, maintaining consistency in the admin interface.
                - Improved organization of script dependencies to enhance loading efficiency.

* Implement role-based access control for apps

                - Added role-based access control features to the home screen app, allowing app access to be restricted based on user roles.
                - Introduced new settings in the admin interface to enable role-based permissions and select specific roles for app access.
                - Enhanced app management functions to support user role filtering when retrieving apps.
                - Created migration utilities to update existing apps with role fields and slugs for compatibility with the new system.
                - Updated JavaScript to handle role selection and visibility in the admin forms, improving user experience.

* Refactor whitespace and enhance output sanitization in admin files

                - Cleaned up unnecessary whitespace in multiple files for improved code readability.
                - Updated output handling in home-admin.php to ensure proper sanitization of role counts displayed to users.
                - Maintained consistency in code formatting across class-home-apps.php, class-home-migration.php, and class-home-roles-permissions.php.

* Implement theme toggle functionality and enhance styling support

                - Introduced a theme toggle feature allowing users to switch between light and dark modes.
                - Added JavaScript for theme management, including saving user preferences and applying styles dynamically.
                - Updated CSS to support theme variables and transitions for a smoother user experience.
                - Enhanced home screen layout with a dedicated area for the theme toggle button.
                - Incremented version numbers for related stylesheets and scripts to reflect changes.

* Fix whitespace issue in magic-link-home-app.php for improved code readability

* Enhance app color management in admin interface

* Implement menu toggle and training view functionality

                - Added a menu toggle feature to enhance navigation on the home screen.
                - Introduced a new training view, allowing users to access training videos separately.
                - Updated JavaScript to manage menu interactions and refresh data dynamically.
                - Enhanced CSS for improved styling and responsiveness across different views.
                - Refactored home screen layout to accommodate new features and maintain consistency.

* Refactor whitespace for improved code readability in magic-link-home-app.php and home-admin.php

* Add launcher navigation and wrapper functionality for app-type magic links

                - Introduced a launcher bottom navigation bar for app-type magic link apps, enhancing user navigation.
                - Implemented a launcher wrapper page that loads target apps in an iframe when the launcher parameter is present in the URL.
                - Updated CSS to style the new launcher navigation and ensure compatibility with dark mode.
                - Added helper functions to generate magic URLs for coded apps and manage app navigation.
                - Refactored existing code to accommodate the new features and improve overall structure.

* Refactor magic link app functionality and improve URL handling

                - Cleaned up whitespace for better code readability in magic-link-home-app.php.
                - Enhanced URL handling by sanitizing HTTP_HOST and REQUEST_URI to prevent potential issues.
                - Updated launcher navigation and wrapper functionality to ensure proper loading of target apps.
                - Improved error logging for better debugging and tracking of app-type pages.

* Enhance magic link app functionality and UI

                - Added logout URL handling to the menu toggle script for improved user experience.
                - Updated CSS to set background styles to transparent for better visual consistency across themes.
                - Refactored JavaScript to manage app navigation and iframe requests more effectively.
                - Introduced helper functions for generating logout URLs and detecting iframe requests.
                - Improved error logging for better debugging and tracking of app-type pages.

* Refactor launcher navigation registration in magic link app

                - Introduced a method to conditionally register launcher hooks based on the presence of a launcher query parameter or when viewing the home screen app.
                - Improved code organization and readability by encapsulating launcher hook logic in a dedicated function.

* Update magic link app styles and functionality

                - Bumped version of home screen CSS to 1.0.19 for improved styling.
                - Enhanced responsiveness of the home screen container with new media queries for better readability on different devices.
                - Updated app card and icon styles for consistency and improved visual appeal.
                - Implemented theme-aware icon color handling in both admin and frontend, ensuring proper color display based on user preferences.
                - Refactored JavaScript to apply theme-aware colors dynamically and maintain custom colors for icons.
                - Migrated old app data structure to new format, ensuring compatibility with the updated theme.

* Refactor whitespace and improve code readability in migration and admin files

                                - Cleaned up whitespace in home-admin.php for better readability.
                                - Standardized formatting in migration file 0062 to enhance code clarity.
                                - Ensured consistent spacing throughout the codebase to improve maintainability.

* Remove unnecessary comments in migration file 0062 to streamline code and enhance clarity.

* Refactor magic link app and launcher functionality

                - Updated root and type properties in the magic link home app to align with new structure.
                - Enhanced URL handling in the launcher bottom navigation to prioritize magic keys and improve fallback logic.
                - Removed default sample apps and videos initialization for a cleaner setup.
                - Improved magic URL generation for user and template post types, ensuring better handling of magic keys.
                - Streamlined migration process by deactivating the old plugin to prevent conflicts with the new implementation.

* Refactor URL handling in launcher bottom navigation and migration file

                                - Updated variable names for clarity in the launcher bottom navigation to improve code readability.
                                - Removed unnecessary whitespace in the migration file to streamline the code.
                                - Enhanced URL parsing logic to ensure consistent handling of app URLs.

* Add login modal functionality and styles to magic link home app

                                - Implemented a login modal for unauthenticated users, enhancing user experience by prompting for login when necessary.
                                - Added translations for login-related text to support multiple languages.
                                - Introduced JavaScript functions to handle login form submission and error display.
                                - Updated CSS to style the login modal, ensuring responsiveness and theme compatibility.
                                - Refactored existing JavaScript to check authentication before loading app content, improving security and flow.
                                - Enhanced error handling for login failures to provide clearer feedback to users.

* Update loading spinner styles and remove console logs for cleaner code

                - Increased loading spinner size for better visibility and updated border color for improved aesthetics.
                - Refactored loading card structure in frontend files to enhance layout consistency.
                - Removed unnecessary console log statements across various JavaScript files to streamline code and reduce clutter.

* change primary color

* Enhance app icon handling and styling in home app

                - Added responsive styles for app icons, ensuring images fit within their containers and maintain aspect ratios.
                - Updated background color and border styles for app cards to improve visual consistency.
                - Introduced a new method to load home apps, separating them from magic link apps for better organization.
                - Enhanced icon rendering logic to support both image and icon class types, improving flexibility in app display.

* Add user invitation and login requirements settings in home admin

                - Introduced settings to allow users to invite others and require login for accessing the home screen.
                - Updated the admin interface to include checkboxes for these new settings, with appropriate descriptions.
                - Enhanced form handling to ensure these settings are saved correctly and integrated into existing functionality.
                - Added JavaScript to manage the submission of these new settings in the admin form.
                - Implemented backend functions to check if user invitations and login requirements are enabled.

* Refactor settings handling in home admin

                                - Cleaned up whitespace in the handle_settings_save method for improved readability.
                                - Ensured consistent formatting throughout the method to enhance code maintainability.
                                - No functional changes were made; this commit focuses solely on code style improvements.

* Enhance theme-aware color handling and app card styles

                - Updated CSS for dark mode to improve specificity and maintainability, consolidating selectors for app cards and other elements.
                - Refactored JavaScript to handle color reset functionality for app forms, ensuring proper updates to descriptions based on user input.
                - Improved app color handling in the backend to use empty strings for no custom color, preserving options in WordPress.
                - Added theme-aware icon color application for launcher navigation, ensuring consistent styling across different components.
                - Removed redundant CSS rules and moved component styles to dedicated CSS files for better organization.

* Refactor whitespace and improve color handling in home admin and launcher navigation

                                - Cleaned up whitespace in the home admin file for better readability.
                                - Enhanced color handling logic to ensure proper updates and prevent unnecessary color changes.
                                - Improved custom color checks in the launcher navigation to align with backend logic.
                                - Updated HTML attributes to use wp_kses for better security and consistency.

* Refactor app handling and improve coded app management

                - Enhanced the logic for managing coded apps, ensuring that only customization fields are saved for these apps.
                - Updated the app retrieval and update methods to better handle coded app customizations, merging them with their base app data.
                - Improved the admin interface to reflect the read-only nature of certain fields for coded apps, providing clear user feedback.
                - Refactored CSS for better specificity and maintainability across various components, ensuring consistent styling.
                - Cleaned up whitespace and improved code readability throughout the affected files.

* Refactor conditional logic for coded app management in home apps class

                - Improved readability of the conditional statement that checks for coded app IDs and creation types.
                - Ensured consistent handling of app customizations by refining the merging logic with coded app data.

* Refactor home app styles and menu toggle functionality

                - Updated JavaScript to ensure the current view is accurately retrieved and managed, improving the handling of active menu items.
                - Refactored CSS to enhance specificity and maintainability, including a minimal CSS reset for better styling consistency.
                - Adjusted styles for app cards and launcher navigation to ensure proper theme support and responsiveness.
                - Cleaned up whitespace and improved code readability across affected files.

* Refactor menu toggle JavaScript for improved readability

                                - Cleaned up whitespace in the menu toggle script to enhance code clarity.
                                - Improved the focus logic for active menu items, ensuring better accessibility for keyboard users.

* Refactor whitespace in magic link home app for improved readability

                                - Cleaned up unnecessary whitespace in the JavaScript and CSS arrays to enhance code clarity.
                                - No functional changes were made; this commit focuses solely on code style improvements.

* Consolidate dark mode styles for improved maintainability

                                - Merged multiple dark mode header and text color styles into consolidated selectors for better readability and maintainability.
                                - Removed redundant CSS rules related to theme-aware menu item colors, as they are already covered by existing styles.
                                - Enhanced overall theme support by streamlining color handling across various components.

* Refactor styles and improve structure for home screen components

                - Moved various inline styles from the magic link home app to the external home-screen.css for better organization and maintainability.
                - Updated class names in the JavaScript for training video cards to align with the new CSS structure.
                - Enhanced the launcher bottom navigation to ensure proper visibility and responsiveness, including a dummy spacer for layout consistency.
                - Consolidated dark mode styles and improved specificity across components for a more cohesive theme experience.

* Refactor launcher navigation and improve dark mode styles

                - Updated class names in the launcher navigation to use consistent 'dt-' prefixes, enhancing clarity and maintainability.
                - Consolidated dark mode styles for various components, ensuring a cohesive theme experience across the application.
                - Improved CSS variable usage for better theme support and responsiveness in the launcher bottom navigation and app selector.
                - Cleaned up JavaScript to align with the new class structure, enhancing readability and maintainability.

* Refactor magic link home app and consolidate styles into home-screen.css

                                - Moved all inline styles from the magic link home app to home-screen.css for improved organization and maintainability.
                                - Removed unused JavaScript functions related to video handling, streamlining the codebase.
                                - Updated dark mode styles for links and other components to enhance theme consistency.
                                - Cleaned up the JavaScript logic for section toggling and theme initialization, improving readability and performance.
                                - Enhanced CSS variable usage for better theme support across the application.

Author: kodinkat

dt-apps/dt-home/README.md

@@ -0,0 +1,163 @@
+# DT Home Screen Magic Link App
+
+## Overview
+
+This is a self-contained magic link app for the Disciple.Tools theme that provides a Home Screen dashboard functionality. It replaces the functionality previously provided by the `@dt-home/` plugin, but is now integrated directly into the theme.
+
+## Structure
+
+```
+dt-apps/dt-home/
+├── magic-link-home-app.php          # Main magic link app class
+├── dt-home-loader.php               # Main loader file
+├── admin/
+│   └── home-admin.php               # Admin interface (hooks into theme settings)
+├── frontend/
+│   └── home-screen.php              # Main dashboard template
+├── assets/
+│   ├── css/
+│   │   ├── home-screen.css          # Frontend styles
+│   │   └── admin.css                 # Admin styles
+│   └── js/
+│       ├── home-screen.js           # Frontend JavaScript
+│       └── admin.js                  # Admin JavaScript
+└── includes/                         # Additional classes (future phases)
+```
+
+## Features (Phase 1)
+
+### ✅ Completed
+- **Magic Link App Structure** - Follows the existing theme pattern
+- **Home Screen Dashboard** - Basic frontend interface
+- **Admin Integration** - Hooks into theme settings as a new tab
+- **Responsive Design** - Mobile-friendly layout
+- **Theme Integration** - Loaded via theme's functions.php
+
+### 🔄 Future Phases
+- **Apps Management** - CRUD for custom apps
+- **Training Videos** - Video management and display
+- **User Authentication** - Enhanced login/logout
+- **Settings Management** - Advanced configuration options
+
+## Usage
+
+### For Users
+1. Navigate to your user settings in Disciple.Tools
+2. Find the "Home Screen" app in your apps list
+3. Click to generate your magic link
+4. Access your personalized dashboard
+
+### For Administrators
+1. Go to Settings (D.T) in the WordPress admin
+2. Click on the "Home Screen" tab (or use the direct submenu item)
+3. Configure general settings, apps, and training videos
+
+## How to Test Phase 1
+
+### Admin Interface Testing
+1. **Direct Access**: Go to Settings (D.T) → Home Screen (submenu item)
+2. **Tab Navigation**: Go to Settings (D.T) → click "Home Screen" tab
+3. **Settings Form**: Test saving general settings (title, description, training videos toggle)
+4. **Form Validation**: Try submitting empty title to test validation
+
+### Magic Link Testing
+1. **User Settings**: Go to user profile → Your Apps section
+2. **App Generation**: Look for "Home Screen" app in the list
+3. **Magic Link**: Click to generate/copy the magic link
+4. **Frontend Access**: Visit the generated magic link URL
+5. **Dashboard Display**: Verify the home screen loads with placeholder content
+
+### Frontend Testing
+1. **Responsive Design**: Test on mobile/tablet/desktop
+2. **Loading States**: Check loading spinners work
+3. **Quick Actions**: Test Settings and Logout buttons
+4. **Error Handling**: Verify error messages display properly
+
+## Development
+
+This app follows the established pattern for magic link apps in the Disciple.Tools theme:
+
+1. **Magic Link Class** - Extends `DT_Magic_Url_Base`
+2. **REST Endpoints** - Uses WordPress REST API
+3. **Admin Integration** - Hooks into theme settings system
+4. **Frontend Templates** - PHP templates with WordPress standards
+5. **Asset Management** - Uses WordPress enqueue system
+
+## Integration Points
+
+- **Theme Settings**: `dt_settings_tab_menu` and `dt_settings_tab_content` hooks
+- **Magic Link System**: Standard magic link registration
+- **User Management**: Integrates with existing user system
+- **Asset Loading**: Uses theme's asset management system
+
+## Future Development
+
+This structure provides a clean pattern for future magic link apps:
+
+1. Create new directory under `dt-apps/`
+2. Follow the same structure
+3. Add loader to `functions.php`
+4. Hook into theme systems as needed
+
+## Phase 2 Status: ✅ COMPLETE
+
+### ✅ Phase 2 Completed Features
+- **Apps Management** - Full CRUD operations for custom apps
+- **Training Videos** - Full CRUD operations for training videos  
+- **Admin Interface** - Complete management interface
+- **Frontend Display** - Real apps and videos display
+- **Data Persistence** - WordPress options API storage
+- **Validation** - Input validation and error handling
+
+## How to Test Phase 2
+
+### Admin Interface Testing
+1. **Apps Management**:
+   - Go to Settings (D.T) → Home Screen
+   - Test creating new apps with different settings
+   - Test editing existing apps
+   - Test deleting apps
+   - Verify apps appear in the list with correct information
+
+2. **Training Videos Management**:
+   - Test creating new training videos with YouTube URLs
+   - Test editing video details (title, description, duration, category)
+   - Test deleting videos
+   - Verify videos appear in the list with thumbnails
+
+3. **Form Validation**:
+   - Try submitting empty required fields
+   - Test invalid URLs
+   - Verify error messages display properly
+
+### Frontend Testing
+1. **Real Data Display**:
+   - Generate a magic link from user settings
+   - Visit the magic link URL
+   - Verify real apps and videos load (not placeholders)
+   - Test clicking on apps and videos (should open in new tab)
+
+2. **Dynamic Content**:
+   - Add new apps/videos in admin
+   - Refresh the frontend to see changes
+   - Test with different app colors and icons
+
+3. **Error Handling**:
+   - Test with no apps/videos configured
+   - Verify appropriate "no content" messages
+
+### Data Persistence Testing
+1. **Settings Persistence**:
+   - Change general settings and save
+   - Refresh page to verify settings persist
+   - Test enabling/disabling training videos
+
+2. **Content Persistence**:
+   - Add apps and videos
+   - Refresh admin page to verify they persist
+   - Test editing and verify changes save
+
+## Phase 1 Status: ✅ COMPLETE
+## Phase 2 Status: ✅ COMPLETE
+
+The core functionality is now complete. Ready for Phase 3 development (enhanced features).