fix: Customize 24h vs 12h time formatting globally #63
Conversation
🦋 Changeset detectedLatest commit: 84c21d7 The changes in this PR will be included in the next version bump. This PR includes changesets to release 2 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
|
||
| import { semanticKeyedColor, truncateMiddle } from './utils'; | ||
| import Link from 'next/link'; | ||
|
|
||
|
|
| @@ -37,7 +37,7 @@ export default function SearchTimeRangePicker({ | |||
| setInputValue, | |||
| onSearch, | |||
| showLive = false, | |||
| timeFormat = '24h', | |||
| timeFormat = '12h', | |||
There was a problem hiding this comment.
minor thing - it looks like we end up overwriting this in the UI via
hyperdx/packages/app/src/timeQuery.ts
Line 18 in f231d1f
That being said, I don't think it's a huge deal, and something we can probably clean up once #75 lands since it might conflict anyways.
|
This PR currently has a merge conflict. Please resolve this and then re-add the |
|
Oh one more thing, could you add a changeset as well? @treypisano :) feel free to ping me on discord as well if you need another review to get this merged before EoM :P (apologies I took forever on this one) |
| @@ -421,6 +428,17 @@ export default function TeamPage() { | |||
| </Modal.Body> | |||
| </Modal> | |||
| </div> | |||
| <div> | |||
| <h2 className="mt-5">Time Format</h2> | |||
There was a problem hiding this comment.
I know we don't have a global personal setting place, could we maybe for now just put some subtext describing that this setting is a local setting and won't propagate across the entire team? Since this settings page is technically supposed to be the team page.
Something like:
<div className="text-muted my-2">
Note: Only affects your own view and does not propagate to
other team members.
</div>
Don't want to block this PR on how we should be treating personal vs team settings :)
There was a problem hiding this comment.
Good idea, I'll implement this
|
@treypisano looks like just one more lint issue then we can get this merged :) |
What does this Pull Request Do?
Opening up this PR in order to discuss implementation of 12h and 24h time formats. I added the tokens used for formatting (ex:
MMM d h:mm:ss a) as constant inutils.ts, in order to avoid copy and pasting these in all the places its needed.Then, I used the
userUserPreferenceshook to read what the preference is in the Context, get the required token, and then format the graph accordingly.At the moment, all the line charts and the logger are changing when the
initialStateis changed. Of course in the future this will be changed with a UI component, but I wanted to make sure the base implementation is solid first.How did I test this?
24hrto12hr, refresh, and observe how it changes