Ionic 6 ion-datetime issue when using zoned time (time zone) - ionic-framework

We are trying to use local time in new ion-datetime (Ionic 6). We have followed the instructions from Ionic's documentation on how to convert from UTC to zoned time:
getZonedTime(date: Date) {
const userTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
const zonedTime = utcToZonedTime(date, userTimeZone);
return tzFormat(zonedTime, 'yyyy-MM-dd HH:mm:ssXXX', { timeZone: userTimeZone });
}
But we get two type errors:
TypeError: Cannot destructure property 'month' of 'parseDate(...)' as it is undefined.
at Datetime.processValue (ion-datetime_3.entry.js:1523:15)
at Datetime.componentWillLoad (ion-datetime_3.entry.js:1789:10)
and
TypeError: Cannot read properties of undefined (reading 'month')
at isSameDay (ion-datetime_3.entry.js:30:44)
at getCalendarDayState (ion-datetime_3.entry.js:961:20)
at ion-datetime_3.entry.js:1910:72
at Array.map (<anonymous>)
at Datetime.renderMonth (ion-datetime_3.entry.js:1907:108)
at ion-datetime_3.entry.js:1931:19
We have already tried with all possible ion-datetime's properties. Currently, our template is:
<ion-popover trigger="datetime-popover" show-backdrop="true" size="cover">
<ng-template>
<ion-datetime #datetimePopover
[value]="date"
presentation="date-time">
</ion-datetime>
</ng-template>
</ion-popover>
'date' comes from the getZonedTime() function I mentioned previously, e.g. '2022-04-08 17:35:52-03:00'.
Any ideas?

Related

Setting IonDatetime default value while using watch function from react-hook-form

I'm building a form using Ionic 6, React 18 and react-hook-form 7.37.0.
My form includes a field where a datetime needs to be set, which is implemented with IonDatetime.
Using minuteValues parameter I limit the user to select minutes values in 5 minutes increments.
This works fine. However, IonDatetime is including a default time that does not follow this restriction, any minute value can appear as default. I'd like to have a valid minute value as a default value. I have tried to set a default valid time with value parameter but I've found out that it interferes with the use of the watch function of react-hook-form.
If I watch the IonDatetime field, I cannot set any other value than the default value. Here there is a minimal example of this.
I also leave here the most relevant part of the code.
const birthTime = watch("birthTime");
<IonItem {...register("birthTime")} button={true} id="open-datetime">
<IonLabel>Birth time</IonLabel>
{birthTime !== "" ? (
<IonText>
{format(parseISO(birthTime!), "dd MM yyyy HH:mm")}
</IonText>
) : (
<IonText class="placeholder">Select a date</IonText>
)}
<IonModal ref={modal} trigger="open-datetime">
<IonContent>
<IonDatetime
min="2022-09-18T12:23"
max="2022-10-12T17:22"
value="2022-09-23T15:00"
minuteValues="0,5,10,15,20,25,30,35,40,45,50,55"
onIonChange={(ev: any) => {
setValue(
"birthTime",
dateFormat(
(ev.detail.value as unknown) as Date,
"yyyy-mm-dd'T'HH:MM"
)
);
}}
/>
<IonButton
onClick={() => {
dismiss();
}}
>
Close
</IonButton>
</IonContent>
</IonModal>
</IonItem>

How do I format date in Discord.js v12 as DD/MMM/YYYY

I want to format date in an info command as DD/MMM/YYYY but I keep getting an error
Here's the code:
switch(args[1]) {
case 'info':
let user = msg.mentions.users.first() || msg.author;
let member = msg.mentions.members.first() || msg.member;
const created = (user.createdAt).format("DD, MMM Do YYYY");
const join = (member.joinedAt).format("DD, MMM Do YYYY");
const infoEmbed = new Discord.MessageEmbed()
.setColor(colour)
.setTitle('__Info __')
.setDescription('')
.addFields(
{ name: 'Joined discord:', value: created, inline: true},
{ name: 'Joined server:', value: join, inline: true},
)
msg.channel.send(infoEmbed)
}
And here's the error in the console:
const created = (user.createdAt).format("DD, MMM Do YYYY");
^
TypeError: user.createdAt.format is not a function
Here's an image of the embed without .format("DD, MMM Do YYYY") which is what I'm trying to avoid
What am I doing wrong? Can someone please explain it to me.
(I'm using Visual Studio Code if that's important)
You can use an NPM package named moment to format dates easily, which appears to be what you're missing. You presumably installed discord.js with the following command:
$ npm install discord.js
To install moment, just run the exact same command but replacing discord.js with moment. This will install the package you need.
At the top of your code in the same file, write the following line:
const moment = require('moment');
This 'requires' the moment module, giving you access to its exports (functions, classes, etc) so you can use it in your code.
Using moment to format dates is easy and straightforward. In this scenario, we're formatting a Discord user's createdAt property, which is a date object:
const created = moment(user.createdAt).format('DD/MM/YY');
This should result in what you're looking for.

Google scripts - Formatting date from a form input

To preface I'm very new at this but I currently have a script that outputs a Google Doc/PDF based on inputs into my google form.
The PDF is output whenever a new form is submitted, currently the formatting for the date comes out as DD/MM/YY but I want it to appear as dd MMMM yyyy i.e. 19 May 2020 rather than 19/05/20.
I've tried using the following to change the formatting
var signDate = e.values[1];
var formatSignDate = Utilities.formatDate(signDate, "GMT+1", "dd MMMM yyyy");
body.replaceText('{{Execution Date}}', formatSignDate);
But I get the following error
Exception: The parameters (String,String,String) don't match the method signature for Utilities.formatDate.
at autoFillFromForm(Code:17:28)
What am I doing wrong? Can I not use .formatDate with the date from my sheets cells?
Edit: error message with log of signDate
Stackdriver logs Info signDate = 20/05/2020 Error Exception: The parameters
(String,String,String) don't match the method signature for
Utilities.formatDate. at autoFillFromForm(Code:23:34)
Exception: The parameters (String,String,String) don't match the method signature for Utilities.formatDate
means that signDate is not recognized correctly as a date object
Please provide a log of signDate to help you troubleshoot more in detail.
UPDATE
If you have a date string in UK format ( DD/MM/YYYY), it won't be automatically recognized as a Javascript date object.
You'll need to convert it, e.g:
var convertedDate = new Date(signDate.split('/')[2], signDate.split('/')[1] - 1, signDate.split('/')[0]);
Logger.log(convertedDate);
var formatSignDate = Utilities.formatDate(convertedDate, "GMT+1", "dd MMMM yyyy");
Logger.log(formatSignDate);
Note: Using Utilities.formatDate() as above might give you the wrong date if you are setting it to a different timezone than your script time zone.

Object Number is not an instance of Date, Angular 2 form, typescript

I'm working on an Angular 2 form. I'm getting problems working with a date variable.
For cross-browser compatibility on a calendar input, I'm using ng-pick-datetime (https://www.npmjs.com/package/ng-pick-datetime).
I get this error -> ERROR TypeError: [object Number] is not an instance of Date
The template code of the date input:
<div class="input-control col-sm-6" >
<label class="control-label" for="startDate">
Starting date *
</label>
<owl-date-time
[(ngModel)]="data.startDate"
[dateFormat]="'DD-MM-YYYY'"
[inputId]="'startDate'"
[placeHolder]="'dd-mm-aaaa'"
[type]="'calendar'"
[dataType]="'date'"
[autoClose]="'true'"
id="startDate"
name="startDate"
#startDate="ngModel"
[disabled]="!paramsService.isSolicitante()"
[hideClearButton]="!paramsService.isSolicitante()"
[max]="data.endDate"
required>
</owl-date-time >
</div>
The declaration of this startDate property in the typescript "Data" class:
startDate: Date = new Date();
endDate: Date = null;
As you can see, the [dataType] property on the calendar picker is set to 'date', same type as the variable.
What am I doing wrong?
Solved! It was an issue of assigning the data from one variable to another, with no use of new Date().

Save date as timestamp in CQ5

I need t use the CQ5 xtype 'datefield' since I need only the date and not time tombe entered by the author.
But the issue is that 'datefield' saves the date in JCR as a String and not as a timestap [ as it does when 'datetime' is used.]
Is there a work around to save the date as a timestamp ?
I don't think it is possible to save the date as timestamp using datefield, without meddling with the default script. But as a workaround, you can use datetime and set the property hideTime to true, to hide the time part, so that the author will not be able to author it.
The json for the config is shown below.
{ "fieldLabel":"Date",
"xtype":"datetime",
"hideTime":true,
"name":"./date",
"defaultValue":"now",
"jcr:primaryType":"cq:Widget"
}
You can add defaultValue to 'now', if you want current date to be initialized as the default, if not explicitly filled in by the author, else it can be ignored.
NOTE: The defaultValue: 'now' doesnt work for me in IE (i am using IE 11 and emulating the previous versions through dev tools), but it works fine in Chrome and Mozilla.
A rough workaround for your jsp:
<%#page import="java.text.SimpleDateFormat,java.util.Date"%>
<%
SimpleDateFormat displayDateFormat = new SimpleDateFormat("dd MMM yyyy");
String dateField = properties.get("nameofdatefield", "");
SimpleDateFormat sdf = new SimpleDateFormat("MM/dd/yy");
Date formattedDate = sdf.parse(dateField);
String formattedDateStr = displayDateFormat.format(formattedDate);
out.println('Example of formated string'+formattedDateStr);
%>
From the above, you can also convert it to a Date Object, depending on what you wish to manipulate.
Let me know if the above example helps