Skip to content

Commit be4b4b9

Browse files
feat(condo): DOMA-12625 Add note support across contact interfaces (#6942)
* Add contact note support to UI and queries * Handle null contact notes and clean contact page lint * Use single-line note inputs for contacts * Add note visibility hints across contact views * Inline contact note tooltip without common changes * Remove note tooltip icon from property map * chore(condo): add ru and es translations --------- Co-authored-by: Mikhail Gorbunov <toplenboren@gmail.com>
1 parent ca9cf93 commit be4b4b9

File tree

10 files changed

+62
-6
lines changed

10 files changed

+62
-6
lines changed

apps/condo/domains/contact/components/CreateContactForm.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import {
2323
import Input from '@condo/domains/common/components/antd/Input'
2424
import { ButtonWithDisabledTooltip } from '@condo/domains/common/components/ButtonWithDisabledTooltip'
2525
import { FormWithAction } from '@condo/domains/common/components/containers/FormList'
26+
import { LabelWithInfo } from '@condo/domains/common/components/LabelWithInfo'
2627
import { Loader } from '@condo/domains/common/components/Loader'
2728
import { PhoneInput } from '@condo/domains/common/components/PhoneInput'
2829
import { useValidations } from '@condo/domains/common/hooks/useValidations'
@@ -63,6 +64,8 @@ export const CreateContactForm: React.FC = () => {
6364
const ExampleEmailMessage = intl.formatMessage({ id: 'example.Email' })
6465
const EmailLabel = intl.formatMessage({ id: 'field.EMail' })
6566
const EmailErrorMessage = intl.formatMessage({ id: 'pages.auth.EmailIsNotValid' })
67+
const NoteLabel = intl.formatMessage({ id: 'Note' })
68+
const NoteVisibilityHint = intl.formatMessage({ id: 'contact.note.visibility.hint' })
6669
const SubmitButtonLabel = intl.formatMessage({ id: 'AddContact' })
6770
const AddressLabel = intl.formatMessage({ id: 'field.Address' })
6871
const AddressPlaceholderMessage = intl.formatMessage({ id: 'placeholder.Address' })
@@ -310,6 +313,16 @@ export const CreateContactForm: React.FC = () => {
310313
<Input placeholder={ExampleEmailMessage} />
311314
</Form.Item>
312315
</Col>
316+
<Col lg={18} xs={24}>
317+
<Form.Item
318+
name='note'
319+
label={<LabelWithInfo message={NoteLabel} title={NoteVisibilityHint} />}
320+
labelAlign='left'
321+
{...INPUT_LAYOUT_PROPS}
322+
>
323+
<Input />
324+
</Form.Item>
325+
</Col>
313326
<Col lg={18} xs={24}>
314327
<Form.Item
315328
name='role'

apps/condo/domains/contact/components/EditContactForm.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { ActionBar, Button, Typography, Checkbox, Input } from '@open-condo/ui'
1818

1919
import { FormWithAction } from '@condo/domains/common/components/containers/FormList'
2020
import LoadingOrErrorPage from '@condo/domains/common/components/containers/LoadingOrErrorPage'
21+
import { LabelWithInfo } from '@condo/domains/common/components/LabelWithInfo'
2122
import { Loader } from '@condo/domains/common/components/Loader'
2223
import Prompt from '@condo/domains/common/components/Prompt'
2324
import { useValidations } from '@condo/domains/common/hooks/useValidations'
@@ -53,6 +54,8 @@ export const EditContactForm: React.FC = () => {
5354
const ExamplePhoneMessage = intl.formatMessage({ id: 'example.Phone' })
5455
const ExampleEmailMessage = intl.formatMessage({ id: 'example.Email' })
5556
const EmailLabel = intl.formatMessage({ id: 'field.EMail' })
57+
const NoteLabel = intl.formatMessage({ id: 'Note' })
58+
const NoteVisibilityHint = intl.formatMessage({ id: 'contact.note.visibility.hint' })
5659
const ApplyChangesMessage = intl.formatMessage({ id: 'ApplyChanges' })
5760
const RoleLabel = intl.formatMessage({ id: 'ContactRole' })
5861
const Verified = intl.formatMessage({ id: 'pages.condo.contact.Verified' })
@@ -133,6 +136,7 @@ export const EditContactForm: React.FC = () => {
133136
phone: contact?.phone,
134137
email: contact?.email,
135138
role: contact?.role?.id,
139+
note: contact?.note ?? '',
136140
isVerified: contact?.isVerified,
137141
}), [contact])
138142

@@ -233,6 +237,16 @@ export const EditContactForm: React.FC = () => {
233237
<Input placeholder={ExampleEmailMessage} />
234238
</Form.Item>
235239
</Col>
240+
<Col span={24}>
241+
<Form.Item
242+
{...INPUT_LAYOUT_PROPS}
243+
labelAlign='left'
244+
name='note'
245+
label={<LabelWithInfo message={NoteLabel} title={NoteVisibilityHint} />}
246+
>
247+
<Input />
248+
</Form.Item>
249+
</Col>
236250
<Col span={24}>
237251
<Form.Item
238252
{...INPUT_LAYOUT_PROPS}

apps/condo/domains/contact/queries/Contact.graphql

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ query getContactByUnit ($propertyId: ID!, $unitName: String!, $unitType: Contact
3737
name
3838
email
3939
phone
40+
note
4041
role { id name }
4142
isVerified
4243
}

apps/condo/domains/property/components/panels/Builder/BuildingPanelView.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ const UnitModal: React.FC<IUnitModalProps> = ({ property, unit, contactsLoading,
7575
const FieldContactNameMessage = intl.formatMessage({ id: 'field.FullName.short' })
7676
const FieldPhoneMessage = intl.formatMessage({ id: 'Phone' })
7777
const RolePhoneMessage = intl.formatMessage({ id: 'field.Role' })
78+
const NoteMessage = intl.formatMessage({ id: 'Note' })
7879

7980
const ContactsMessage = intl.formatMessage({ id: 'global.section.contacts' })
8081
const GoToContactMessage = intl.formatMessage({ id: 'pages.condo.property.map.modal.goToContacts' })
@@ -130,6 +131,10 @@ const UnitModal: React.FC<IUnitModalProps> = ({ property, unit, contactsLoading,
130131
label: RolePhoneMessage,
131132
value: contact?.role?.name || '—',
132133
},
134+
{
135+
label: NoteMessage,
136+
value: contact?.note?.trim() || '—',
137+
},
133138
]}/>
134139
<Row justify='end' style={{ marginTop: 8 }}>
135140
<Typography.Link size='large' href={`/contact/${contact.id}`} target='_blank' rel='noreferrer'>
@@ -155,6 +160,7 @@ const UnitTooltip: React.FC<IUnitModalProps> = ({ unit, contactsLoading, contact
155160
const TotalContactsMessage = intl.formatMessage({ id: 'pages.condo.property.map.modal.totalContacts' })
156161
const AndOthersMessage = intl.formatMessage({ id: 'AndOthers' })
157162
const ErrorLoadingContactsMessage = intl.formatMessage({ id: 'pages.condo.property.map.modal.errorLoadingContacts' })
163+
const NoteMessage = intl.formatMessage({ id: 'Note' })
158164

159165
const contactsLines = useMemo(() => {
160166
if (!contactsLoading && contacts) {
@@ -164,9 +170,12 @@ const UnitTooltip: React.FC<IUnitModalProps> = ({ unit, contactsLoading, contact
164170
if (contacts.length === 1) {
165171
const contact = contacts[0]
166172

173+
const noteValue = contact?.note?.trim() || '—'
174+
167175
const result = [
168176
`${ResidentNameMessage}: ${contact.name} ${contact?.role?.name ? `(${contact?.role?.name})` : ''}`,
169177
`${PhoneMessage}: ${contact.phone}`,
178+
`${NoteMessage}: ${noteValue}`,
170179
]
171180

172181
return result

apps/condo/gql/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -962,6 +962,7 @@ export const GetContactByUnitDocument = gql`
962962
name
963963
email
964964
phone
965+
note
965966
role {
966967
id
967968
name

apps/condo/gql/operation.types.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ export type GetContactByUnitQueryVariables = Types.Exact<{
139139
}>;
140140

141141

142-
export type GetContactByUnitQuery = { __typename?: 'Query', contacts?: Array<{ __typename?: 'Contact', id: string, name?: string | null, email?: string | null, phone?: string | null, isVerified?: boolean | null, role?: { __typename?: 'ContactRole', id: string, name?: string | null } | null } | null> | null };
142+
export type GetContactByUnitQuery = { __typename?: 'Query', contacts?: Array<{ __typename?: 'Contact', id: string, name?: string | null, email?: string | null, phone?: string | null, note?: string | null, isVerified?: boolean | null, role?: { __typename?: 'ContactRole', id: string, name?: string | null } | null } | null> | null };
143143

144144
export type GetContactsExistenceQueryVariables = Types.Exact<{
145145
where?: Types.InputMaybe<Types.ContactWhereInput>;

apps/condo/lang/en/en.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -191,6 +191,8 @@
191191
"NoPermissionToSettings": "You have no permission to view this tab content...",
192192
"NoReceiptsLoaded": "There's no data in our system, or it's currently loading",
193193
"NotFound": "Not found",
194+
"Note": "Note",
195+
"contact.note.visibility.hint": "Only visible to your organization",
194196
"NotImplementedYet": "We don't know how to do this yet, but we will definitely learn",
195197
"Now": "Now",
196198
"NumberIsNotValid": "Please enter the correct number",

apps/condo/lang/es/es.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -191,6 +191,8 @@
191191
"NoPermissionToSettings": "No tienes permiso para ver y editar estos ajustes...",
192192
"NoReceiptsLoaded": "Los datos aún no se han cargado en nuestro sistema, o están en proceso de carga",
193193
"NotFound": "No encontrado",
194+
"Note": "Nota",
195+
"contact.note.visibility.hint": "Solo visible para su organización",
194196
"NotImplementedYet": "Aún no sabemos cómo hacerlo, pero aprenderemos",
195197
"Now": "Ahora",
196198
"NumberIsNotValid": "Por favor, introduce el número correcto",

apps/condo/lang/ru/ru.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -191,6 +191,8 @@
191191
"NoPermissionToSettings": "У вас нет прав для просмотра и редактирования данных настроек...",
192192
"NoReceiptsLoaded": "Данные еще не загружены в нашу систему, или их загрузка находится в процессе",
193193
"NotFound": "Не найдено",
194+
"Note": "Заметка",
195+
"contact.note.visibility.hint": "Видно только вам и вашим коллегам",
194196
"NotImplementedYet": "Пока что не умеем, но обязательно научимся",
195197
"Now": "Сейчас",
196198
"NumberIsNotValid": "Пожалуйста, введите корректное число",

apps/condo/pages/contact/[id]/index.tsx

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import LoadingOrErrorPage from '@condo/domains/common/components/containers/Load
2121
import { DeleteButtonWithConfirmModal } from '@condo/domains/common/components/DeleteButtonWithConfirmModal'
2222
import { FieldPairRow as BaseFieldPairRow, FieldPairRowProps } from '@condo/domains/common/components/FieldPairRow'
2323
import { FrontLayerContainer } from '@condo/domains/common/components/FrontLayerContainer'
24+
import { LabelWithInfo } from '@condo/domains/common/components/LabelWithInfo'
2425
import { TicketCardList } from '@condo/domains/common/components/TicketCard/TicketCardList'
2526
import { PageComponentType } from '@condo/domains/common/types'
2627
import { ContactsReadPermissionRequired } from '@condo/domains/contact/components/PageAccess'
@@ -49,11 +50,7 @@ export const ContactPageContent = ({ contact, isContactEditable, softDeleteActio
4950
}) => {
5051
const intl = useIntl()
5152

52-
const {
53-
loading: customValuesLoading,
54-
error: customValuesError,
55-
customValues,
56-
} = useCustomValues({
53+
const { customValues } = useCustomValues({
5754
modelName: CustomFieldModelNameType.Contact,
5855
objectId: contact?.id || '',
5956
skip: !contact?.id,
@@ -68,6 +65,8 @@ export const ContactPageContent = ({ contact, isContactEditable, softDeleteActio
6865
const ConfirmDeleteTitle = intl.formatMessage({ id: 'contact.ConfirmDeleteTitle' })
6966
const ConfirmDeleteMessage = intl.formatMessage({ id: 'contact.ConfirmDeleteMessage' })
7067
const ContactRoleTitle = intl.formatMessage({ id: 'ContactRole' })
68+
const NoteLabel = intl.formatMessage({ id: 'Note' })
69+
const NoteVisibilityHint = intl.formatMessage({ id: 'contact.note.visibility.hint' })
7170
const VerifiedMessage = intl.formatMessage({ id: 'pages.condo.contact.Verified' })
7271
const HasResident = intl.formatMessage({ id: 'pages.condo.contact.HasResident' })
7372
const ResidentRegistred = intl.formatMessage({ id: 'pages.condo.contact.ResidentRegistered' })
@@ -83,6 +82,7 @@ export const ContactPageContent = ({ contact, isContactEditable, softDeleteActio
8382
const unitSuffix = useMemo(() => contactUnitName ? `${UnitTypeMessage.toLowerCase()} ${contactUnitName}` : '', [UnitTypeMessage, contactUnitName])
8483
const contactAddress = useMemo(() => `${contact?.property?.address ?? DeletedMessage} ${unitSuffix}`, [contact, DeletedMessage, unitSuffix])
8584
const contactRoleName = useMemo(() => contact?.role?.name ?? '—', [contact])
85+
const contactNote = useMemo(() => contact?.note?.trim() || '—', [contact])
8686
const isVerified = useMemo(() => contact?.isVerified, [contact])
8787
const hasResident = useMemo(() => contact?.hasResident, [contact])
8888
const phonePrefix = useMemo(() => organizationPhonePrefix ?? '', [organizationPhonePrefix])
@@ -124,6 +124,18 @@ export const ContactPageContent = ({ contact, isContactEditable, softDeleteActio
124124
fieldTitle={ContactRoleTitle}
125125
fieldValue={contactRoleName}
126126
/>
127+
<>
128+
<Col {...CONTACT_FIELD_PAIR_PROPS.titleColProps}>
129+
<Typography.Text type='secondary'>
130+
<LabelWithInfo title={NoteVisibilityHint} message={NoteLabel} />
131+
</Typography.Text>
132+
</Col>
133+
<Col {...CONTACT_FIELD_PAIR_PROPS.valueColProps}>
134+
<Typography.Text>
135+
{contactNote}
136+
</Typography.Text>
137+
</Col>
138+
</>
127139
<>
128140
<Col span={8}>
129141
<Typography.Text type='secondary'>

0 commit comments

Comments
 (0)