Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Added formatting to values in DateTimeCell #3332

Closed
wants to merge 2 commits into from
Closed

Added formatting to values in DateTimeCell #3332

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
318feeb
Added formatting
dikwickley Dec 3, 2023
1c23280
Merge branch 'develop' into highlight-temporalcells-1889
pavish Dec 19, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 8 additions & 1 deletion mathesar_ui/src/components/cell-fabric/data-types/components/date-time/DateTimeCell.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
export let isSelectedInRange: $$Props['isSelectedInRange'];
export let value: $$Props['value'];
export let disabled: $$Props['disabled'];
export let searchValue: $$Props['searchValue'] = undefined;
export let isIndependentOfSheet: $$Props['isIndependentOfSheet'];
export let showTruncationPopover: $$Props['showTruncationPopover'] = false;
export let type: $$Props['type'];
Expand All @@ -17,13 +18,19 @@
export let timeShow24Hr: $$Props['timeShow24Hr'] = true;
export let timeEnableSeconds: $$Props['timeEnableSeconds'] = true;
export let formatForDisplay: $$Props['formatForDisplay'];
let formattedValue = value ? formatter.parseAndFormat(value) : value;
const formattedSearchValue =
typeof searchValue === 'string'
? formatter.parseAndFormat(searchValue)
: searchValue;
</script>

<SteppedInputCell
bind:value
bind:value={formattedValue}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@dikwickley This binding will break the entire functionality of this cell.

Try creating a Date & Time column in a table, and modifying the value in it. You'll notice that the cell no longer displays the value, in your PR.

Please refer the svelte docs on how bind works, and notice that there's already a prop called formatValue which is passed to the SteppedInputCell for the purpose of formatting content. Also when a change is made to a component, make sure to test all places that utilize it. In this scenario, this component is used as the cell in tables and explorations.

{isActive}
{isSelectedInRange}
{disabled}
searchValue={formattedSearchValue}
highlightSubstringMatches={false}
{isIndependentOfSheet}
{showTruncationPopover}
Expand Down
Loading