IO-3515 Improved feedback layout.

This commit is contained in:
Patrick Fic
2026-03-19 14:54:40 -07:00
parent b2231007b6
commit 5812d53efc
2 changed files with 41 additions and 28 deletions

View File

@@ -79,7 +79,7 @@ function BillAiFeedback({ billForm, rawAIData }) {
return (
<Form form={form} onFinish={submitFeedback} requiredMark={false}>
<Space align="top" size="large">
<Space wrap align="top" size="small">
<Form.Item name="rating" label={t("bills.labels.ai.feedback_prompt")} rules={[{ required: true }]}>
<Radio.Group optionType="button" buttonStyle="solid">
<Radio.Button value="up">
@@ -91,12 +91,18 @@ function BillAiFeedback({ billForm, rawAIData }) {
</Radio.Group>
</Form.Item>
<Form.Item name="comments">
<Input.TextArea rows={1} placeholder={t("bills.labels.ai.feedback_placeholder")} />
</Form.Item>
<Button onClick={() => form.submit()} loading={submitting} disabled={submitting}>
{t("bills.labels.ai.submit_feedback")}
</Button>
<Space wrap size="small" orientation="vertical">
<Form.Item name="comments">
<Input.TextArea
rows={3}
style={{ minWidth: "400px" }}
placeholder={t("bills.labels.ai.feedback_placeholder")}
/>
</Form.Item>
<Button onClick={() => form.submit()} loading={submitting} disabled={submitting}>
{t("bills.labels.ai.submit_feedback")}
</Button>
</Space>
</Space>
</Form>
);

View File

@@ -1,6 +1,6 @@
import { useApolloClient, useMutation } from "@apollo/client/react";
import { useTreatmentsWithConfig } from "@splitsoftware/splitio-react";
import { Button, Checkbox, Form, Modal, Space } from "antd";
import { Button, Checkbox, Divider, Form, Modal, Space } from "antd";
import _ from "lodash";
import { useEffect, useMemo, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
@@ -477,27 +477,34 @@ function BillEnterModalContainer({ billEnterModal, toggleModalVisible, bodyshop,
setLoading(false);
}}
footer={
<Space align="top">
{isAiScan && <BillAiFeedback billForm={form} rawAIData={rawAIData} />}
<Checkbox checked={generateLabel} onChange={(e) => setGenerateLabel(e.target.checked)}>
{t("bills.labels.generatepartslabel")}
</Checkbox>
<Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
<Button loading={loading} onClick={() => form.submit()} id="save-bill-enter-modal">
{t("general.actions.save")}
</Button>
{billEnterModal.context && billEnterModal.context.id ? null : (
<Button
type="primary"
loading={loading}
onClick={() => {
setEnterAgain(true);
}}
id="save-and-new-bill-enter-modal"
>
{t("general.actions.saveandnew")}
</Button>
<Space orientation="vertical">
{isAiScan && (
<>
<BillAiFeedback billForm={form} rawAIData={rawAIData} />
<Divider orientation="horizontal" />
</>
)}
<Space wrap align="top">
<Checkbox checked={generateLabel} onChange={(e) => setGenerateLabel(e.target.checked)}>
{t("bills.labels.generatepartslabel")}
</Checkbox>
<Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
<Button loading={loading} onClick={() => form.submit()} id="save-bill-enter-modal">
{t("general.actions.save")}
</Button>
{billEnterModal.context && billEnterModal.context.id ? null : (
<Button
type="primary"
loading={loading}
onClick={() => {
setEnterAgain(true);
}}
id="save-and-new-bill-enter-modal"
>
{t("general.actions.saveandnew")}
</Button>
)}
</Space>
</Space>
}
destroyOnHidden