Property Value

import { Component } from "@odoo/owl";
import { CheckBox } from "@web/core/checkbox/checkbox";
import { DateTimeInput } from "@web/core/datetime/datetime_input";
import { Domain } from "@web/core/domain";
import { Dropdown } from "@web/core/dropdown/dropdown";
import { DropdownItem } from "@web/core/dropdown/dropdown_item";
import {
    deserializeDate,
    deserializeDateTime,
    formatDate,
    formatDateTime,
    serializeDate,
    serializeDateTime,
} from "@web/core/l10n/dates";
import { _t } from "@web/core/l10n/translation";
import { TagsList } from "@web/core/tags_list/tags_list";
import { useService } from "@web/core/utils/hooks";
import { formatInteger, formatMany2one, formatMonetary } from "@web/views/fields/formatters";
import { formatFloat } from "@web/core/utils/numbers";
import { parseFloat, parseInteger, parseMonetary } from "@web/views/fields/parsers";
import { Many2XAutocomplete, useOpenMany2XRecord } from "@web/views/fields/relational_utils";
import { PropertyTags } from "./property_tags";
import { PropertyText } from "./property_text";
import { imageUrl } from "@web/core/utils/urls";
import { getCurrency } from "@web/core/currency";
import { nbsp } from "@web/core/utils/strings";

function extractData(record) {
    let name;
    if ("display_name" in record) {
        name = record.display_name;
    } else if ("name" in record) {
        name = record.name.id ? record.name.display_name : record.name;
    }
    return { id: record.id, display_name: name };
}

/**
 * Represent one property value.
 * Supports many types and instantiates the appropriate component for it.
 * - Text
 * - Integer
 * - Boolean
 * - Selection
 * - Datetime & Date
 * - Many2one
 * - Many2many
 * - Monetary
 * - Tags
 * - ...
 */
export class PropertyValue extends Component {
    static template = "web.PropertyValue";
    static components = {
        Dropdown,
        DropdownItem,
        CheckBox,
        DateTimeInput,
        Many2XAutocomplete,
        TagsList,
        PropertyTags,
        PropertyText,
    };

    static props = {
        id: { type: String, optional: true },
        type: { type: String, optional: true },
        comodel: { type: String, optional: true },
        currencyField: { type: String, optional: true },
        domain: { type: String, optional: true },
        string: { type: String, optional: true },
        value: { optional: true },
        context: { type: Object },
        readonly: { type: Boolean, optional: true },
        canChangeDefinition: { type: Boolean, optional: true },
        selection: { type: Array, optional: true },
        tags: { type: Array, optional: true },
        onChange: { type: Function, optional: true },
        onTagsChange: { type: Function, optional: true },
        record: { type: Object, optional: true },
    };

    setup() {
        this.nbsp = nbsp;

        this.orm = useService("orm");
        this.action = useService("action");

        this.openMany2X = useOpenMany2XRecord({
            resModel: this.props.model,
            activeActions: {
                create: false,
                createEdit: false,
                write: true,
            },
            isToMany: false,
            onRecordSaved: async (record) => {
                if (!record) {
                    return;
                }
                // maybe the record display name has changed
                const records = await this.orm.read(
                    record.resModel,
                    [record.resId],
                    ["display_name"],
                    {
                        context: this.context,
                    }
                );
                const recordData = extractData(records[0]);
                await this.onValueChange([recordData]);
            },
            fieldString: this.props.string,
        });
    }

    /* --------------------------------------------------------
     * Public methods / Getters
     * -------------------------------------------------------- */