Implement new Feature online/offline selection #37
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Introduces the InitialChoiceComponent, including its HTML, CSS, and TypeScript files, along with a basic test suite. This sets up the initial structure for further development of the component.
Implemented an interface and UI for selecting Offline or Online modes during the initial setup. Integrated dark mode compatibility, countdown timer, and navigation logic based on user choice, updating settings accordingly.
Introduced a new tasks page with related components, styling, and tests. Updated app routes to include the tasks page and adjusted the app layout to use `router-outlet` for dynamic page rendering. Slightly modified global styles for better layout consistency.
Introduced a new CreateAccountComponent, including HTML template, CSS, TypeScript logic, and unit test. The component handles different modes ('local' and 'online') based on route parameters, initializing forms accordingly.
The InitialChoiceComponent import was no longer in use and has been removed to clean up the codebase. This helps improve clarity and reduces unnecessary dependencies.
Replaced placeholder text with a functional UI for account creation, including username, password, and avatar inputs. Integrated dark mode styling through a service and added responsive CSS adjustments. Improved component modularity with updated imports and reactive capabilities.
The 'inject' import was not being used in the create-account component and has been removed to clean up the code. This improves readability and reduces unnecessary imports.
Updated the UI to include avatar input and improved setup instructions for clarity. Added functionality in the component to handle avatar during account creation using the AccountService.
Introduced `AccountService` to handle account creation. Implemented methods for creating local and remote accounts, with logic branching based on account type. Added a unit test to ensure the service is created successfully.
Replaced template-driven forms with reactive forms for better validation and state management in account creation. Introduced offline/online account distinction and added validation messages and file handling for avatars. Enhanced the account service to notify users and route upon successful account creation.
Switched from 'touched' to 'dirty' in the account creation form to improve validation accuracy. This ensures error messages are displayed only when the user interacts and modifies the input field.
Implemented a method to resize avatars to 128x128 pixels for consistency during account creation. Added error handling for resizing failures and introduced a `loadLocalAccount` method to retrieve stored account data from local storage.
Introduced `Account` interface and `AccountService` to manage user account data. Now loading the local user account if the initial choice is offline and passing the account information to the footer component via input binding. This improves user-specific functionality and prepares the app for account-aware features.
Replaced static icons with dynamic user avatar and logout functionality in the footer. Added logic to handle avatar retrieval and decoding, with a fallback to a default avatar if necessary. Enhanced tooltip to display the username for better user context.
The NgOptimizedImage import was unnecessary and has been removed to clean up unused code. This improves maintainability and avoids potential confusion in the future.
Commented out the logout icon in the footer for a cleaner design and replaced the default avatar image from PNG to a new SVG file. This ensures improved scalability and visual quality for the default avatar.
iptoux
changed the title
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This pull request introduces several updates and improvements to the footer component:
NgOptimizedImageimport for better maintainability.AccountServiceto manage user account data and enable seamless information flow to the footer component.Checklist