Managing recurring days and times in Angular and retrieving the next scheduled time

I'm currently working on a new feature that will allow users to set multiple wake alarms for specific days and times. For example, they may want alarms to go off on Mondays, Wednesdays, and Fridays at 7:00 AM and 8:00 PM, and on Tuesdays and Thursdays at 6:00 AM and 9:00 PM.

One of the challenges I'm facing is determining the most efficient way to store this data in order to:

  1. Display all the set days/times including options for adding or removing alarms.
  2. Create a function that can determine the next scheduled time based on the current time. For instance, if it's Monday at 8:05 PM, the function should return Tuesday at 6:00 AM.

Initially, I tried storing the days and times in an array like this:

{
"0":["07:00","20:00"],
"1":["06:00","21:00"],
"2":["07:00","20:00"],
...
}

In this setup, "0" represents the value returned by getDay() for Monday. While this approach made it easy to access times for a specific day, it proved challenging to calculate the next scheduled time efficiently. My initial solution involved using a forEach() loop to iterate through the array and compare the current day/time until finding the next scheduled alarm, but it felt cumbersome and inefficient.

Do you have any suggestions for a more streamlined solution, perhaps utilizing Angular or a specific library?

Answer №1

You have the option to utilize _.sortedIndex from the library called lodash. Check out more information about it here.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Error: An unexpected token < was caught in the TypeScript Express code

Using TypeScript to compile and run an Express server that simply serves an HTML file. However, encountering an error in the response under the network tab in Chrome for app.js: Uncaught SyntaxError: Unexpected token '<' Below is the server c ...

Struggling with getting autocomplete and auto import to work properly while working on an Angular project

After installing the latest version of VSCode on my Windows system, I proceeded to add language support for TypeScript and configure my editor settings by adjusting the font size, disabling the minimap, enabling autosave on focus change, and more. Addition ...

What is the correct way to define the onClick event in a React component?

I have been encountering an issue while trying to implement an onClick event in React using tsx. The flexbox and button are being correctly displayed, but I am facing a problem with the onClick event in vscode. I have tried several ideas from the stack com ...

Having trouble selecting all checkboxes in Angular

Having issues with selecting all checkboxes in a populated Angular dataTable. I've tried the code below but it doesn't seem to be working. Can you help me find a solution? Please check out the Stackblitz link for a demo. isChecked = false; checku ...

The Next.js build failed due to the absence of the required "slug" parameter being passed as a string

I'm currently working on setting up a blog using Next.js and TypeScript, and I've encountered an issue with [slug].tsx. The error message I'm receiving is: Build error occurred Error: A required parameter (slug) was not provided as a strin ...

Checking for Webpack has begun in a separate process - not found

After working on my Angular2 + Typescript project with Webpack, I noticed a change in the bundling process. Previously, the console output would display three specific comments at the end: webpack: bundle is now VALID [default] Checking started in sepear ...

Typescript: Defining the correct return type for resolved parameters in promises

Exploring the world of TypeScript, I recently attempted to convert some basic JavaScript promise samples into TypeScript promises. While working on this conversion process, I encountered an issue that has left me puzzled and unable to find a solution even ...

Utilizing CSS classes to style custom day templates in ng-bootstraps datepicker

Currently, I am utilizing ng-bootstraps datepicker to showcase user data on a daily basis. I have implemented a custom day template to apply specific CSS classes. <ng-template #customDay let-date> <div class="custom-day" [ngCla ...

Retrieve the public variable of a child page from the parent page

Is there a way to access the public variable offlineArticlesCount from an inner child page within the parent page? Please note: Each of the 3 components mentioned below has its own set of modules. myPage.html - Parent Page <picks *ngFor="let pick of ...

Why isn't the table in the select query updating after an insert query is executed in Express?

Seeking assistance! Currently, I am delving into express and typescript. I have encountered an issue where the table from a select query does not update after an insert query when rendering a view. Strangely, the data in the table remains unchanged (showin ...

The AgGridModule type does not feature the property 'ɵmod'

Recently, I decided to update my application from Angular 12 to Angular 13. The tools I am using include webpack 5, ag-grid 15.0.0, and ag-grid-angular 15.0.0. While the compilation process goes smoothly for the app, I encountered an issue when trying to l ...

Can a function's return type be set to match the return type of its callback function?

Check out the following function export const tryAsyncAwait = async (fn: () => any) => { try { const data = await fn(); return [data, null]; } catch (error) { return [null, error]; } }; If I use this function as an example... const ...

What is the best way to compare two TypeScript object arrays for equality, especially when some objects may have multiple ways to be considered equivalent

Currently, I am in the process of developing a cost function for a game where players are given a set of resources in their hand. The resources can be categorized into different types such as Fire, Air, Water, Earth, Good, Evil, Law, Chaos, and Void. Thes ...

To resolve the issue of expired tokens, we must implement a mechanism in Angular to detect when a token has expired. When a token expiration

When utilizing an angular interceptor to include the authorization token in the header, everything functions smoothly until the token expires. Following the expiration of the token, Laravel returns a token_expired error. My goal is to detect this error wit ...

What is the best way to prevent external scrolling when the mat-autocomplete panel is displayed?

When trying to open a mat-autocomplete in Angular Material, I noticed that the background content is still able to scroll. I attempted using the block strategy but it didn't have the desired effect. ...

Tips for getting Angular Ivy and Angular Universal up and running together

I'm encountering a problem while attempting to incorporate Ivy + Angular Universal into my project. This issue only arises when I enable Ivy mode in Angular (disabling it allows me to successfully build my application). Below are the steps to replic ...

What is the process of mapping an array of object IDs in order to retrieve the corresponding objects associated with each ID

I currently have a specific collection that stores IDs referencing objects in a separate schema. If I'm working with an array containing these IDs, what is the best way to iterate through and retrieve the corresponding object? Although I've mad ...

Issue with accessing the 'subscribe' property in nested calls within Angular 2 due to it being undefined

I am trying to implement a subscription in company-list.component using the method getCompanies() from the company.service. However, I am encountering the following error: Cannot read property 'subscribe' of undefined Here is the code snippet ...

Issue with detecting undefined in a nested function using Typescript

Examining the code snippet provided below, focus on the test getter. Why is it that const name = this.person.name does not result in an error, while const processPerson = () => this.person.name does generate an error? interface Person { name: string; ...

Generate a new entry by analyzing components from a separate array in a single line

I have a list of essential items and I aim to generate a record based on the elements within that list. Each item in the required list will correspond to an empty array in the exist record. Essentially, I am looking to condense the following code into one ...