QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-20 06:40:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Refactoring all import directories to alias and all .js|.jsx renamed to be .ts|.tsx

Browse Source
This commit is contained in:
a.bouhuolia
2022-07-15 23:25:23 +02:00
parent cd08d0ee16
commit f00097f6c8
3846 changed files with 125197 additions and 128236 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
src/components/Contacts/VendorSelectField.js → src/components/Contacts/ContactSelecetList.tsx
View File

@@ -1,47 +1,32 @@
import React, { useCallback, useState, useEffect, useMemo } from 'react';
import { FormattedMessage as T } from 'components';
import { FormattedMessage as T } from '@/components';
import intl from 'react-intl-universal';
import * as R from 'ramda';
import { MenuItem, Button } from '@blueprintjs/core';
import { Select } from '@blueprintjs/select';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
import { CLASSES } from '@/constants/classes';
import {
itemPredicate,
handleContactRenderer,
createNewItemFromQuery,
createNewItemRenderer,
} from './utils';
import withDrawerActions from 'containers/Drawer/withDrawerActions';
import { DRAWERS } from 'common/drawers';
function VendorSelectField({
// #withDrawerActions
openDrawer,
// #ownProps
contacts,
export function ContactSelecetList({
contactsList,
initialContactId,
selectedContactId,
createNewItemFrom,
defaultSelectText = <T id={'select_contact'} />,
onContactSelected,
popoverFill = false,
disabled = false,
allowCreate,
buttonProps,
...restProps
}) {
const localContacts = useMemo(
const contacts = useMemo(
() =>
contacts.map((contact) => ({
contactsList.map((contact) => ({
...contact,
_id: `${contact.id}_${contact.contact_type}`,
})),
[contacts],
[contactsList],
);
const initialContact = useMemo(
@@ -62,33 +47,48 @@ function VendorSelectField({
}
}, [selectedContactId, contacts, setSelectedContact]);
const handleContactSelect = useCallback(
(contact) => {
if (contact.id) {
setSelectedContact({ ...contact });
onContactSelected && onContactSelected(contact);
} else {
openDrawer(DRAWERS.QUICK_WRITE_VENDOR);
}
},
[setSelectedContact, onContactSelected, openDrawer],
const handleContactRenderer = useCallback(
(contact, { handleClick }) => (
<MenuItem
key={contact.id}
text={contact.display_name}
onClick={handleClick}
/>
),
[],
);
// Maybe inject create new item props to suggest component.
const maybeCreateNewItemRenderer = allowCreate ? createNewItemRenderer : null;
const maybeCreateNewItemFromQuery = allowCreate
? createNewItemFromQuery
: null;
const onContactSelect = useCallback(
(contact) => {
setSelectedContact({ ...contact });
onContactSelected && onContactSelected(contact);
},
[setSelectedContact, onContactSelected],
);
// Filter Contact List
const itemPredicate = (query, contact, index, exactMatch) => {
const normalizedTitle = contact.display_name.toLowerCase();
const normalizedQuery = query.toLowerCase();
if (exactMatch) {
return normalizedTitle === normalizedQuery;
} else {
return (
`${contact.display_name} ${normalizedTitle}`.indexOf(normalizedQuery) >=
0
);
}
};
return (
<Select
items={localContacts}
items={contacts}
noResults={<MenuItem disabled={true} text={<T id={'no_results'} />} />}
itemRenderer={handleContactRenderer}
itemPredicate={itemPredicate}
filterable={true}
disabled={disabled}
onItemSelect={handleContactSelect}
onItemSelect={onContactSelect}
popoverProps={{ minimal: true, usePortal: !popoverFill }}
className={classNames(CLASSES.FORM_GROUP_LIST_SELECT, {
[CLASSES.SELECT_LIST_FILL_POPOVER]: popoverFill,
@@ -96,9 +96,6 @@ function VendorSelectField({
inputProps={{
placeholder: intl.get('filter_'),
}}
createNewItemRenderer={maybeCreateNewItemRenderer}
createNewItemFromQuery={maybeCreateNewItemFromQuery}
createNewItemPosition={'top'}
{...restProps}
>
<Button
@@ -111,5 +108,3 @@ function VendorSelectField({
</Select>
);
}
export default R.compose(withDrawerActions)(VendorSelectField);

6
src/components/Contacts/ContactSelectField.js → src/components/Contacts/ContactSelectField.tsx
View File

@@ -1,15 +1,15 @@
import React, { useCallback, useState, useEffect, useMemo } from 'react';
import { FormattedMessage as T } from 'components';
import { FormattedMessage as T } from '@/components';
import intl from 'react-intl-universal';
import { MenuItem, Button } from '@blueprintjs/core';
import { Select } from '@blueprintjs/select';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
import { CLASSES } from '@/constants/classes';
import { itemPredicate, handleContactRenderer } from './utils';
export default function ContactSelectField({
export function ContactSelectField({
contacts,
initialContactId,
selectedContactId,

42
src/components/Contacts/ContactsMultiSelect.tsx Normal file
View File

@@ -0,0 +1,42 @@
import React, { useCallback } from 'react';
import { MenuItem } from '@blueprintjs/core';
import { MultiSelect } from '../MultiSelectTaggable';
/**
* Contacts multi-select component.
*/
export function ContactsMultiSelect({ ...multiSelectProps }) {
// Filters accounts items.
const filterContactsPredicater = useCallback(
(query, contact, _index, exactMatch) => {
const normalizedTitle = contact.display_name.toLowerCase();
const normalizedQuery = query.toLowerCase();
if (exactMatch) {
return normalizedTitle === normalizedQuery;
} else {
return normalizedTitle.indexOf(normalizedQuery) >= 0;
}
},
[],
);
return (
<MultiSelect
itemRenderer={(contact, { selected, active, handleClick }) => (
<MenuItem
active={active}
icon={selected ? 'tick' : 'blank'}
text={contact.display_name}
key={contact.id}
onClick={handleClick}
/>
)}
popoverProps={{ minimal: true }}
fill={true}
itemPredicate={filterContactsPredicater}
tagRenderer={(item) => item.display_name}
{...multiSelectProps}
/>
);
}

107
src/components/Contacts/ContactsSuggestField.tsx Normal file
View File

@@ -0,0 +1,107 @@
import React, { useCallback, useState, useEffect, useMemo } from 'react';
import { MenuItem } from '@blueprintjs/core';
import { Suggest } from '@blueprintjs/select';
import { FormattedMessage as T } from '@/components';
import classNames from 'classnames';
import { CLASSES } from '@/constants/classes';
import intl from 'react-intl-universal';
export function ContactsSuggestField({
contactsList,
initialContactId,
selectedContactId,
defaultTextSelect = intl.get('select_contact'),
onContactSelected,
selectedContactType = [],
popoverFill = false,
...suggestProps
}) {
// filteredContacts
const contacts = useMemo(
() =>
contactsList.map((contact) => ({
...contact,
_id: `${contact.id}_${contact.contact_type}`,
})),
[contactsList],
);
const initialContact = useMemo(
() => contacts.find((a) => a.id === initialContactId),
[initialContactId, contacts],
);
const [selecetedContact, setSelectedContact] = useState(
initialContact || null,
);
useEffect(() => {
if (typeof selectedContactId !== 'undefined') {
const contact = selectedContactId
? contacts.find((a) => a.id === selectedContactId)
: null;
setSelectedContact(contact);
}
}, [selectedContactId, contacts, setSelectedContact]);
const contactRenderer = useCallback(
(contact, { handleClick }) => (
<MenuItem
key={contact.id}
text={contact.display_name}
label={contact.formatted_contact_service}
onClick={handleClick}
/>
),
[],
);
const onContactSelect = useCallback(
(contact) => {
setSelectedContact({ ...contact });
onContactSelected && onContactSelected(contact);
},
[setSelectedContact, onContactSelected],
);
const handleInputValueRenderer = (inputValue) => {
if (inputValue) {
return inputValue.display_name.toString();
}
};
const filterContacts = (query, contact, index, exactMatch) => {
const normalizedTitle = contact.display_name.toLowerCase();
const normalizedQuery = query.toLowerCase();
if (exactMatch) {
return normalizedTitle === normalizedQuery;
} else {
return (
`${contact.display_name} ${normalizedTitle}`.indexOf(normalizedQuery) >=
0
);
}
};
return (
<Suggest
items={contacts}
noResults={<MenuItem disabled={true} text={<T id={'no_results'} />} />}
itemRenderer={contactRenderer}
itemPredicate={filterContacts}
onItemSelect={onContactSelect}
selectedItem={selecetedContact}
inputProps={{ placeholder: defaultTextSelect }}
resetOnClose={true}
popoverProps={{ minimal: true, boundary: 'window' }}
inputValueRenderer={handleInputValueRenderer}
className={classNames(CLASSES.FORM_GROUP_LIST_SELECT, {
[CLASSES.SELECT_LIST_FILL_POPOVER]: popoverFill,
})}
{...suggestProps}
/>
);
}

116
src/components/Contacts/CustomerSelectField.js
View File

@@ -1,116 +0,0 @@
import React, { useCallback, useState, useEffect, useMemo } from 'react';
import { FormattedMessage as T } from 'components';
import intl from 'react-intl-universal';
import * as R from 'ramda';
import { MenuItem, Button } from '@blueprintjs/core';
import { Select } from '@blueprintjs/select';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
import {
itemPredicate,
handleContactRenderer,
createNewItemRenderer,
createNewItemFromQuery,
} from './utils';
import withDrawerActions from 'containers/Drawer/withDrawerActions';
import { DRAWERS } from 'common/drawers';
function CustomerSelectField({
// #withDrawerActions
openDrawer,
// #ownProps
contacts,
initialContactId,
selectedContactId,
defaultSelectText = <T id={'select_contact'} />,
onContactSelected,
popoverFill = false,
disabled = false,
allowCreate,
buttonProps,
...restProps
}) {
const localContacts = useMemo(
() =>
contacts.map((contact) => ({
...contact,
_id: `${contact.id}_${contact.contact_type}`,
})),
[contacts],
);
const initialContact = useMemo(
() => contacts.find((a) => a.id === initialContactId),
[initialContactId, contacts],
);
const [selecetedContact, setSelectedContact] = useState(
initialContact || null,
);
useEffect(() => {
if (typeof selectedContactId !== 'undefined') {
const account = selectedContactId
? contacts.find((a) => a.id === selectedContactId)
: null;
setSelectedContact(account);
}
}, [selectedContactId, contacts, setSelectedContact]);
const handleContactSelect = useCallback(
(contact) => {
if (contact.id) {
setSelectedContact({ ...contact });
onContactSelected && onContactSelected(contact);
} else {
openDrawer(DRAWERS.QUICK_CREATE_CUSTOMER);
}
},
[setSelectedContact, onContactSelected, openDrawer],
);
// Maybe inject create new item props to suggest component.
const maybeCreateNewItemRenderer = allowCreate ? createNewItemRenderer : null;
const maybeCreateNewItemFromQuery = allowCreate
? createNewItemFromQuery
: null;
return (
<Select
items={localContacts}
noResults={<MenuItem disabled={true} text={<T id={'no_results'} />} />}
itemRenderer={handleContactRenderer}
itemPredicate={itemPredicate}
filterable={true}
disabled={disabled}
onItemSelect={handleContactSelect}
popoverProps={{ minimal: true, usePortal: !popoverFill }}
className={classNames(CLASSES.FORM_GROUP_LIST_SELECT, {
[CLASSES.SELECT_LIST_FILL_POPOVER]: popoverFill,
})}
inputProps={{
placeholder: intl.get('filter_'),
}}
createNewItemRenderer={maybeCreateNewItemRenderer}
createNewItemFromQuery={maybeCreateNewItemFromQuery}
createNewItemPosition={'top'}
{...restProps}
>
<Button
disabled={disabled}
text={
selecetedContact ? selecetedContact.display_name : defaultSelectText
}
{...buttonProps}
/>
</Select>
);
}
export default R.compose(withDrawerActions)(CustomerSelectField);

5
src/components/Contacts/index.js
View File

@@ -1,5 +0,0 @@
import ContactSelectField from './ContactSelectField';
import CustomerSelectField from './CustomerSelectField';
import VendorSelectField from './VendorSelectField';
export { ContactSelectField, CustomerSelectField, VendorSelectField };

4
src/components/Contacts/index.tsx Normal file
View File

@@ -0,0 +1,4 @@
export * from './ContactSelectField';
export * from './ContactsSuggestField';
export * from './ContactSelecetList';
export * from './ContactsMultiSelect';

0
src/components/Contacts/utils.js → src/components/Contacts/utils.tsx
View File