(core) Use visibleCol instead of displayCol with createFormatter

Summary:
Some things (like rendering cells) use the `visibleCol` for `createFormatter`, while other things (like `CopySelection`) used the `displayCol`. For references, the display column has type Any and doesn't know about the original formatting. This resulted in formatting being lost when copying from reference columns even though formatting was preserved when copying from the original (visible) column which looked identical. This diff fixes this and ensures that `createFormatter` is always used with the `visibleCol`. This was agreed on in https://grist.slack.com/archives/C0234CPPXPA/p1639571321043000

Additionally:

- Replaces the functions `createVisibleColFormatter` computed properties `visibleColFormatter` as suggested by a `TODO`.
- Extracts common code from `createVisibleColFormatter` in `ColumnRec` and `ViewFieldRec`

Test Plan: Fixed a test in CopyPaste which displayed the previous inconsistent behaviour.

Reviewers: jarek

Reviewed By: jarek

Differential Revision: https://phab.getgrist.com/D3189
This commit is contained in:
Alex Hall
2021-12-16 00:31:53 +02:00
parent 30c8ba3019
commit c470c4041b
11 changed files with 34 additions and 58 deletions

View File

@@ -1,7 +1,5 @@
var dispose = require('../lib/dispose');
const ko = require('knockout');
const {Computed, fromKo} = require('grainjs');
const ValueFormatter = require('app/common/ValueFormatter');
const {cssLabel, cssRow} = require('app/client/ui/RightPanel');
const {colorSelect} = require('app/client/ui2018/ColorSelect');
@@ -17,8 +15,7 @@ function AbstractWidget(field, opts = {}) {
this.options = field.widgetOptionsJson;
const {defaultTextColor = '#000000'} = opts;
this.valueFormatter = this.autoDispose(ko.computed(() =>
ValueFormatter.createFormatter(field.displayColModel().type(), this.options(), field.documentSettings())));
this.valueFormatter = this.field.visibleColFormatter;
this.textColor = Computed.create(this, (use) => use(this.field.textColor) || defaultTextColor)
.onWrite((val) => this.field.textColor(val === defaultTextColor ? undefined : val));

View File

@@ -8,9 +8,8 @@ import {ViewFieldRec} from 'app/client/models/entities/ViewFieldRec';
import {SaveableObjObservable} from 'app/client/models/modelUtil';
import {cssLabel, cssRow} from 'app/client/ui/RightPanel';
import {colorSelect} from 'app/client/ui2018/ColorSelect';
import {BaseFormatter, createFormatter} from 'app/common/ValueFormatter';
import {BaseFormatter} from 'app/common/ValueFormatter';
import {Computed, Disposable, DomContents, fromKo, Observable} from 'grainjs';
import * as ko from 'knockout';
export interface Options {
@@ -44,11 +43,7 @@ export abstract class NewAbstractWidget extends Disposable {
)).onWrite((val) => this.field.textColor(val === defaultTextColor ? undefined : val));
this.fillColor = fromKo(this.field.fillColor);
// Note that its easier to create a knockout computed from the several knockout observables,
// but then we turn it into a grainjs observable.
const formatter = this.autoDispose(ko.computed(() =>
createFormatter(field.displayColModel().type(), this.options(), field.documentSettings())));
this.valueFormatter = fromKo(formatter);
this.valueFormatter = fromKo(field.visibleColFormatter);
}
/**

View File

@@ -6,9 +6,7 @@ import {icon} from 'app/client/ui2018/icons';
import {IOptionFull, select} from 'app/client/ui2018/menus';
import {NTextBox} from 'app/client/widgets/NTextBox';
import {isFullReferencingType, isVersions} from 'app/common/gristTypes';
import {BaseFormatter} from 'app/common/ValueFormatter';
import {Computed, dom, styled} from 'grainjs';
import * as ko from 'knockout';
/**
* Reference - The widget for displaying references to another table's records.
@@ -16,16 +14,12 @@ import * as ko from 'knockout';
export class Reference extends NTextBox {
protected _formatValue: Computed<(val: any) => string>;
private _refValueFormatter: ko.Computed<BaseFormatter>;
private _visibleColRef: Computed<number>;
private _validCols: Computed<Array<IOptionFull<number>>>;
constructor(field: ViewFieldRec) {
super(field);
this._refValueFormatter = this.autoDispose(ko.computed(() =>
field.createVisibleColFormatter()));
this._visibleColRef = Computed.create(this, (use) => use(this.field.visibleColRef));
// Note that saveOnly is used here to prevent display value flickering on visible col change.
this._visibleColRef.onWrite((val) => this.field.visibleColRef.saveOnly(val));
@@ -48,7 +42,7 @@ export class Reference extends NTextBox {
this._formatValue = Computed.create(this, (use) => {
// If the field is pulling values from a display column, use a general-purpose formatter.
if (use(this.field.displayColRef) !== use(this.field.colRef)) {
const fmt = use(this._refValueFormatter);
const fmt = use(this.field.visibleColFormatter);
return (val: any) => fmt.formatAny(val);
} else {
const refTable = use(use(this.field.column).refTable);