Closes #1040 Adds feature: Dropdown format date/time #2505

marcoapcaldas · 2023-02-13T11:11:25Z

Description

This changes adds a dropdown menu with some suggestions for format date and time.

closes [#1040]

Checklist

I have followed the guidelines in the Contributing document
My changes follow the coding style of this project
My changes build without any errors or warnings
My changes have been formatted and linted
My changes include any required corresponding changes to the documentation (including CHANGELOG.md and README.md)
My changes have been rebased and squashed to the minimal number (typically 1) of relevant commits
My changes have a descriptive commit message with a short title, including a Fixes $XXX - or Closes #XXX - prefix to auto-close the issue that your PR addresses

eamodio

Thanks for this! This is a clever use of the existing token popup pattern.

I've added some comments and requested some changes.

Also not yet sure if we should change the popup behavior for the after you select a date choice -- should it then close (which would be different than the tokens). Need to play with it more.

Will also need to think about the other patterns supported since GL uses the https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat now (with backward compat to moment-style formats)

eamodio · 2023-03-15T17:55:30Z

CHANGELOG.md

@@ -28,6 +28,7 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/) and this p
  - Ensures new worktrees are created from the "main" repo, if already in a worktree
 - Adds a new _remote_ command to the _Git Command Palette_ to add, prune, and remove remotes
 - Adds a _Create Worktree for Pull Request via GitLens..._ context menu command on pull requests in the _GitHub Pull Requests and Issues_ extension's views
+- Adds sugested options for date and time formats &mdash; closes [#1040](https://github.com/gitkraken/vscode-gitlens/issues/1040)


Typo: suggested

done ff9a980#diff-06572a96a58dc510037d5efa622f9bec8519bc1beab13c9f251e97e657a9d4edR10

eamodio · 2023-03-15T17:57:04Z

src/webviews/apps/shared/appWithConfigBase.ts

@@ -278,7 +279,16 @@ export abstract class AppWithConfig<State extends AppStateWithConfig> extends Ap
 		const $popup = document.getElementById(`${element.name}.popup`);
 		if ($popup != null) {
 			if ($popup.childElementCount === 0) {
-				const $template = document.querySelector<HTMLTemplateElement>('#token-popup')?.content.cloneNode(true);
+				let $template;
+				if (


Let's use an attribute or something here that avoids hard-coding the date input names

done 4c7a5e2

eamodio · 2023-03-15T17:57:24Z

src/webviews/apps/shared/appWithConfigBase.ts

-
-		const token = `\${${element.dataset.token}}`;
+		let token!: string;
+		if (


done 4c7a5e2

eamodio · 2023-03-15T17:58:03Z

src/webviews/apps/shared/appWithConfigBase.ts

+			input.name == 'defaultTimeFormat' ||
+			input.name == 'defaultDateFormat'
+		) {
+			token = `${element.dataset.token}`;


Shouldn't need the template string here -- just:

Suggested change

token = `${element.dataset.token}`;

token = element.dataset.token;

done - 0c7c824

eamodio · 2023-03-15T17:59:50Z

src/webviews/apps/settings/settings.html

+		</div>
+		<span class="token-popup__hint">
+			<i class="icon icon__info"></i>
+			<a href="https://github.com/gitkraken/vscode-gitlens/wiki/Custom-Formatting" title="Open formatting docs"


We'd need to get a Wiki page for date formatting here

eamodio · 2023-03-15T18:01:12Z

src/webviews/apps/settings/partials/dates.html

 							/>
+							<label for="defaultDateFormat" title="See some sugested date/time formats">


Typo: suggested

done b69157a

(Good day) Seems like this branch isn't up to date!

Yup, that's why I started to work on my own branch with these commits

Edit
#2623

eamodio · 2023-03-15T18:01:55Z

src/webviews/apps/settings/partials/dates.html

@@ -69,17 +69,23 @@ <h2>Dates & Times</h2>
 						</span>
 					</div>

-					<div class="setting">
-						<div class="setting__input">
+					<div class="setting" data-enablement="currentLine.enabled">


Shouldn't have the data-enablement set here.

eamodio · 2023-03-15T18:02:06Z

src/webviews/apps/settings/partials/dates.html

 							<input
 								id="defaultDateFormat"
 								name="defaultDateFormat"
 								type="text"
 								placeholder="defaults to MMMM Do, YYYY h:mma"
 								data-setting
 								data-setting-preview
+								data-popup-trigger
+								disabled


Shouldn't have disabled here

eamodio · 2023-03-15T18:02:49Z

src/webviews/apps/settings/partials/dates.html

 							/>
+							<label for="defaultDateShortFormat" title="See some sugested date/time formats">


Typo: suggested

done b69157a

eamodio · 2023-03-15T18:02:58Z

src/webviews/apps/settings/partials/dates.html

 							/>
+							<label for="defaultTimeFormat" title="See some sugested date/time formats">


Typo: suggested

done b69157a

pelukron · 2023-04-06T09:18:05Z

Thanks for this! This is a clever use of the existing token popup pattern.

I've added some comments and requested some changes.

Also not yet sure if we should change the popup behavior for the after you select a date choice -- should it then close (which would be different than the tokens). Need to play with it more.

Will also need to think about the other patterns supported since GL uses the https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat now (with backward compat to moment-style formats)

@marcoapcaldas could I support you to close some of the comments on this PR?

pelukron · 2023-04-07T00:08:25Z

src/webviews/apps/shared/appWithConfigBase.ts

-				input.selectionEnd ?? selectionStart,
-			)}`;
+			if (
+				input.name == 'defaultDateShortFormat' ||


this is related with above commit - to https://github.com/gitkraken/vscode-gitlens/pull/2505/files/09bea8d0b5ddf478cc31262e9442e0d702185bd8?diff=split&w=0#r1137539072

done - 4c7a5e2

marcoapcaldas and others added 2 commits February 13, 2023 07:50

Closes gitkraken#1040 Adds feature: Dropdown format date/time

08f4352

Merge branch 'main' into feature/date-format-dropdown

09bea8d

eamodio requested changes Mar 15, 2023

View reviewed changes

pelukron mentioned this pull request Apr 6, 2023

Closes #1040 Adds feature: Dropdown format date/time #2623

Closed

7 tasks

pelukron reviewed Apr 7, 2023

View reviewed changes

pelukron mentioned this pull request Apr 7, 2023

Date format dropdown #1040

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Closes #1040 Adds feature: Dropdown format date/time #2505

Closes #1040 Adds feature: Dropdown format date/time #2505

marcoapcaldas commented Feb 13, 2023

eamodio left a comment

eamodio Mar 15, 2023

pelukron Apr 7, 2023

eamodio Mar 15, 2023

pelukron Apr 7, 2023

eamodio Mar 15, 2023

pelukron Apr 7, 2023

eamodio Mar 15, 2023

pelukron Apr 7, 2023

eamodio Mar 15, 2023

eamodio Mar 15, 2023

pelukron Apr 7, 2023

sadasant Apr 13, 2023

pelukron Apr 16, 2023 •

edited

eamodio Mar 15, 2023

eamodio Mar 15, 2023

eamodio Mar 15, 2023

pelukron Apr 7, 2023

eamodio Mar 15, 2023

pelukron Apr 7, 2023

pelukron commented Apr 6, 2023

pelukron Apr 7, 2023 •

edited

	token = `${element.dataset.token}`;
	token = element.dataset.token;

		/>
		<label for="defaultDateFormat" title="See some sugested date/time formats">

		/>
		<label for="defaultDateShortFormat" title="See some sugested date/time formats">

		/>
		<label for="defaultTimeFormat" title="See some sugested date/time formats">

Closes #1040 Adds feature: Dropdown format date/time #2505

Are you sure you want to change the base?

Closes #1040 Adds feature: Dropdown format date/time #2505

Conversation

marcoapcaldas commented Feb 13, 2023

Description

Checklist

eamodio left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pelukron Apr 16, 2023 • edited

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

pelukron commented Apr 6, 2023

pelukron Apr 7, 2023 • edited

Choose a reason for hiding this comment

pelukron Apr 16, 2023 •

edited

pelukron Apr 7, 2023 •

edited