From 91aa263225083d3de6d68fca08b253b685bc7e4b Mon Sep 17 00:00:00 2001 From: wxiaoguang Date: Wed, 3 Jan 2024 03:09:18 +0800 Subject: [PATCH] Make template `DateTime` show proper tooltip (#28677) There was a question about "how to improve the datetime display for SSH/PGP/WebAuthn" https://github.com/go-gitea/gitea/pull/28262#issuecomment-1831141611 The root problem is that `DateTime` misses the "data-tooltip-content" attribute, which should be used to make the tooltip popup smoothly. Now the UI is consistent and the end users could see the detailed hour/minute/second easily by hovering the element. ![image](https://github.com/go-gitea/gitea/assets/2114189/2211336f-d59d-4f64-a83b-099f8ef6d29b) ![image](https://github.com/go-gitea/gitea/assets/2114189/f02a9c86-476d-48d6-aece-85a800235fbd) --- modules/timeutil/datetime.go | 17 +++++++++++------ modules/timeutil/datetime_test.go | 18 ++++++++---------- templates/user/settings/security/webauthn.tmpl | 4 +++- 3 files changed, 22 insertions(+), 17 deletions(-) diff --git a/modules/timeutil/datetime.go b/modules/timeutil/datetime.go index d254a56a74..62b94f7cf4 100644 --- a/modules/timeutil/datetime.go +++ b/modules/timeutil/datetime.go @@ -12,7 +12,7 @@ import ( ) // DateTime renders an absolute time HTML element by datetime. -func DateTime(format string, datetime any, attrs ...string) template.HTML { +func DateTime(format string, datetime any, extraAttrs ...string) template.HTML { if p, ok := datetime.(*time.Time); ok { datetime = *p } @@ -49,15 +49,20 @@ func DateTime(format string, datetime any, attrs ...string) template.HTML { panic(fmt.Sprintf("Unsupported time type %T", datetime)) } - extraAttrs := strings.Join(attrs, " ") + attrs := make([]string, 0, 10+len(extraAttrs)) + attrs = append(attrs, extraAttrs...) + attrs = append(attrs, `data-tooltip-content`, `data-tooltip-interactive="true"`) + attrs = append(attrs, `format="datetime"`, `weekday=""`, `year="numeric"`) switch format { case "short": - return template.HTML(fmt.Sprintf(`%s`, extraAttrs, datetimeEscaped, textEscaped)) + attrs = append(attrs, `month="short"`, `day="numeric"`) case "long": - return template.HTML(fmt.Sprintf(`%s`, extraAttrs, datetimeEscaped, textEscaped)) + attrs = append(attrs, `month="long"`, `day="numeric"`) case "full": - return template.HTML(fmt.Sprintf(`%s`, extraAttrs, datetimeEscaped, textEscaped)) + attrs = append(attrs, `month="short"`, `day="numeric"`, `hour="numeric"`, `minute="numeric"`, `second="numeric"`) + default: + panic(fmt.Sprintf("Unsupported format %s", format)) } - panic(fmt.Sprintf("Unsupported format %s", format)) + return template.HTML(fmt.Sprintf(`%s`, strings.Join(attrs, " "), datetimeEscaped, textEscaped)) } diff --git a/modules/timeutil/datetime_test.go b/modules/timeutil/datetime_test.go index 387e6274a7..26494b8475 100644 --- a/modules/timeutil/datetime_test.go +++ b/modules/timeutil/datetime_test.go @@ -8,16 +8,14 @@ import ( "time" "code.gitea.io/gitea/modules/setting" + "code.gitea.io/gitea/modules/test" "github.com/stretchr/testify/assert" ) func TestDateTime(t *testing.T) { - oldTz := setting.DefaultUILocation - setting.DefaultUILocation, _ = time.LoadLocation("America/New_York") - defer func() { - setting.DefaultUILocation = oldTz - }() + testTz, _ := time.LoadLocation("America/New_York") + defer test.MockVariableValue(&setting.DefaultUILocation, testTz)() refTimeStr := "2018-01-01T00:00:00Z" refTime, _ := time.Parse(time.RFC3339, refTimeStr) @@ -29,17 +27,17 @@ func TestDateTime(t *testing.T) { assert.EqualValues(t, "-", DateTime("short", TimeStamp(0))) actual := DateTime("short", "invalid") - assert.EqualValues(t, `invalid`, actual) + assert.EqualValues(t, `invalid`, actual) actual = DateTime("short", refTimeStr) - assert.EqualValues(t, `2018-01-01T00:00:00Z`, actual) + assert.EqualValues(t, `2018-01-01T00:00:00Z`, actual) actual = DateTime("short", refTime) - assert.EqualValues(t, `2018-01-01`, actual) + assert.EqualValues(t, `2018-01-01`, actual) actual = DateTime("short", refTimeStamp) - assert.EqualValues(t, `2017-12-31`, actual) + assert.EqualValues(t, `2017-12-31`, actual) actual = DateTime("full", refTimeStamp) - assert.EqualValues(t, `2017-12-31 19:00:00 -05:00`, actual) + assert.EqualValues(t, `2017-12-31 19:00:00 -05:00`, actual) } diff --git a/templates/user/settings/security/webauthn.tmpl b/templates/user/settings/security/webauthn.tmpl index dd8b8a4e59..da6e5977c6 100644 --- a/templates/user/settings/security/webauthn.tmpl +++ b/templates/user/settings/security/webauthn.tmpl @@ -11,7 +11,9 @@
{{.Name}}
- {{TimeSinceUnix .CreatedUnix ctx.Locale}} +
+ {{ctx.Locale.Tr "settings.added_on" (DateTime "short" .CreatedUnix) | Safe}} +