Created
April 13, 2023 05:43
-
-
Save sminnee/0850e72c6dd5e538efa765166089ab9a to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
diff --git a/client/src/AppRoutes.tsx b/client/src/AppRoutes.tsx | |
index 351779730..6f56d9c08 100644 | |
--- a/client/src/AppRoutes.tsx | |
+++ b/client/src/AppRoutes.tsx | |
@@ -204,9 +204,11 @@ const ContentRoutes = () => ( | |
</AuthenticatedRoute> | |
} | |
/> | |
- {PropertyDetailRoute(RouteURLs.VIEW_PROPERTY)} | |
- {PropertyDetailRoute(RouteURLs.VIEW_PROPERTY_TAB)} | |
+ {PropertyDetailRoute(RouteURLs.VIEW_PROPERTY, true)} | |
+ {PropertyDetailRoute(RouteURLs.VIEW_PROPERTY_TAB, true)} | |
{PropertyDetailRoute(RouteURLs.VIEW_PROPERTY_DOCUMENT)} | |
+ {PropertyDetailRoute(RouteURLs.VIEW_PROPERTY_CONTACT)} | |
+ {PropertyDetailRoute(RouteURLs.VIEW_PROPERTY_CONTACT_TAB)} | |
<Route | |
path={RouteURLs.VIEW_LEVEL} | |
element={ | |
@@ -543,7 +545,7 @@ const WorkOrderDetailRoutes = () => ( | |
</Route> | |
); | |
-const PropertyDetailRoute = (path: string) => ( | |
+const PropertyDetailRoute = (path: string, assetAndWorkOrderRoutes = false) => ( | |
<Route | |
path={path} | |
element={ | |
@@ -556,13 +558,14 @@ const PropertyDetailRoute = (path: string) => ( | |
/> | |
</AuthenticatedRoute> | |
}> | |
- {WorkOrderDialogRoutes()} | |
- {AssetRoutes( | |
- RouteURLs.VIEW_ASSET_REL.replace("assets", ":tab"), | |
- RouteURLs.VIEW_ASSET_TAB_REL.replace("assets", ":tab"), | |
- RouteURLs.CREATE_ASSET_REL.replace("assets", ":tab"), | |
- RouteURLs.EDIT_ASSET_REL.replace("assets", ":tab") | |
- )} | |
+ {assetAndWorkOrderRoutes && WorkOrderDialogRoutes()} | |
+ {assetAndWorkOrderRoutes && | |
+ AssetRoutes( | |
+ RouteURLs.VIEW_ASSET_REL.replace("assets", ":tab"), | |
+ RouteURLs.VIEW_ASSET_TAB_REL.replace("assets", ":tab"), | |
+ RouteURLs.CREATE_ASSET_REL.replace("assets", ":tab"), | |
+ RouteURLs.EDIT_ASSET_REL.replace("assets", ":tab") | |
+ )} | |
</Route> | |
); | |
diff --git a/client/src/RouteURLs.ts b/client/src/RouteURLs.ts | |
index 015096ced..b301c4144 100644 | |
--- a/client/src/RouteURLs.ts | |
+++ b/client/src/RouteURLs.ts | |
@@ -27,6 +27,9 @@ enum RouteURLs { | |
VIEW_PROPERTY = "/properties/:id", | |
VIEW_PROPERTY_TAB = "/properties/:id/:tab", | |
VIEW_PROPERTY_DOCUMENT = "/properties/:id/:tab/document/:code", | |
+ VIEW_PROPERTY_CONTACT = "/properties/:id/:tab/contact/:contactId", | |
+ VIEW_PROPERTY_CONTACT_TAB = "/properties/:id/:tab/contact/:contactId/:contactTab", | |
+ VIEW_PROPERTY_CONTACT_TAB_DOCUMENT = "/properties/:id/:tab/contact/:contactId/:contactTab/document/:documentCode", | |
MAP_PROPERTIES = "/properties/map", | |
/* levels */ | |
VIEW_LEVEL = "/levels/:id", | |
@@ -109,8 +112,13 @@ export default RouteURLs; | |
// Property paths | |
-export const pathForProperty = (property: { id: string }) => | |
- generatePath(RouteURLs.VIEW_PROPERTY, { id: property.id + "" }); | |
+export const pathForProperty = (property: { id: string }, tab = "") => { | |
+ if (tab) { | |
+ return generatePath(RouteURLs.VIEW_PROPERTY_TAB, { id: property.id + "", tab }); | |
+ } else { | |
+ return generatePath(RouteURLs.VIEW_PROPERTY, { id: property.id + "" }); | |
+ } | |
+}; | |
// Area paths | |
@@ -132,19 +140,57 @@ export const pathForAsset = (asset: { code: string }) => | |
// Contact paths | |
-export const pathForContact = (contact: { id: number | string; type: string }, contactTab = "") => { | |
+export const pathForContact = ( | |
+ contact: { id: number | string; type: string }, | |
+ contactTab = "", | |
+ baseLocation: string | null = null | |
+) => { | |
+ let matches; | |
const { id, type } = contact; | |
if (contactTab) { | |
+ // Special case for contacts within property section | |
+ if (baseLocation && (matches = baseLocation.match(/\/properties\/([0-9]+)\/contacts/))) { | |
+ return generatePath(RouteURLs.VIEW_PROPERTY_CONTACT_TAB, { | |
+ id: matches[1], | |
+ tab: "contacts", | |
+ contactId: id + "", | |
+ contactTab, | |
+ }); | |
+ } | |
+ | |
return generatePath(RouteURLs.VIEW_CONTACT_TAB, { id: id + "", type, contactTab }); | |
} else { | |
+ // Special case for contacts within property section | |
+ if (baseLocation && (matches = baseLocation.match(/\/properties\/([0-9]+)\/contacts/))) { | |
+ return generatePath(RouteURLs.VIEW_PROPERTY_CONTACT, { id: matches[1], tab: "contacts", contactId: id + "" }); | |
+ } | |
+ | |
+ return "./contact/" + id; | |
return generatePath(RouteURLs.VIEW_CONTACT, { id: id + "", type }); | |
} | |
}; | |
-export const pathForNewContact = (type: string, contactTab = "") => pathForContact({ id: "new", type }, contactTab); | |
+export const pathForNewContact = (type: string, contactTab = "", baseLocation: string | null = null) => | |
+ pathForContact({ id: "new", type }, contactTab, baseLocation); | |
-export const pathForContactDocument = (contact: { id: number | string; type: string }, document: { code: string }) => { | |
+export const pathForContactDocument = ( | |
+ contact: { id: number | string; type: string }, | |
+ document: { code: string }, | |
+ baseLocation: string | null = null | |
+) => { | |
const { id, type } = contact; | |
+ let matches; | |
+ | |
+ // Special case for contacts within property section | |
+ if (baseLocation && (matches = baseLocation.match(/\/properties\/([0-9]+)\/contacts/))) { | |
+ return generatePath(RouteURLs.VIEW_PROPERTY_CONTACT_TAB_DOCUMENT, { | |
+ id: id + "", | |
+ type, | |
+ contactTab: "documents", | |
+ documentCode: document.code, | |
+ }); | |
+ } | |
+ | |
return generatePath(RouteURLs.VIEW_CONTACT_DOCUMENT, { | |
id: id + "", | |
type, | |
diff --git a/client/src/views/contacts/components/ContactDocumentsTable/index.tsx b/client/src/views/contacts/components/ContactDocumentsTable/index.tsx | |
index 0d47a650c..027c78159 100644 | |
--- a/client/src/views/contacts/components/ContactDocumentsTable/index.tsx | |
+++ b/client/src/views/contacts/components/ContactDocumentsTable/index.tsx | |
@@ -38,7 +38,7 @@ const ContactDocumentsTable = ({ contact, onAddDocument, onEditDocument, readOnl | |
await loadDocuments(); | |
}; | |
- const navOpenDocument = (document: Document) => navigate(pathForContactDocument(contact, document)); | |
+ const navOpenDocument = (document: Document) => navigate("./" + pathForContactDocument(contact, document)); | |
const navCloseDocument = () => navigate(pathForContact(contact, "documents")); | |
// To do: introduce contact-document permissions also | |
diff --git a/client/src/views/contacts/components/ViewContactDialog/index.tsx b/client/src/views/contacts/components/ViewContactDialog/index.tsx | |
index 55e52854e..6e566ebec 100644 | |
--- a/client/src/views/contacts/components/ViewContactDialog/index.tsx | |
+++ b/client/src/views/contacts/components/ViewContactDialog/index.tsx | |
@@ -18,7 +18,7 @@ import HelpIcon from "components/Icons/HelpIcon"; | |
import { HookProps, useDispatchAction, withHooks } from "util/hooks"; | |
import { ENTITIES } from "state/entities/registry"; | |
import { pathForContact } from "RouteURLs"; | |
-import { useNavigate, useParams } from "react-router-dom"; | |
+import { useLocation, useNavigate, useParams } from "react-router-dom"; | |
enum ViewContactDialogStatus { | |
Normal, | |
@@ -57,6 +57,7 @@ const hooks = withHooks((props: any) => ({ | |
archiveContact: useDispatchAction(ENTITIES.contacts.archive), | |
restoreContact: useDispatchAction(ENTITIES.contacts.restore), | |
navigate: useNavigate(), | |
+ location: useLocation(), | |
params: useParams<"contactTab" | "documentCode">(), | |
})); | |
@@ -93,7 +94,7 @@ class ViewContactDialog extends Component<ViewContactDialogProps, ViewContactDia | |
onRecordsTabChanged = (ev: ChangeEvent<{}>, tab: ContactRecordsTab) => { | |
if (this.props.contact) { | |
- this.props.navigate(pathForContact(this.props.contact, tab)); | |
+ this.props.navigate(pathForContact(this.props.contact, tab, this.props.location.pathname)); | |
} | |
}; | |
diff --git a/client/src/views/contacts/list/index.tsx b/client/src/views/contacts/list/index.tsx | |
index ac9b74fda..e840cc063 100644 | |
--- a/client/src/views/contacts/list/index.tsx | |
+++ b/client/src/views/contacts/list/index.tsx | |
@@ -163,7 +163,7 @@ class ContactListView extends Component<ContactListViewProps, ContactListViewSta | |
ev.stopPropagation(); | |
} | |
- this.props.navigate(pathForContact(contact)); | |
+ this.props.navigate(pathForContact(contact, "", this.props.location.pathname)); | |
}; | |
onActionClick = (ev: MouseEvent | undefined, contact: Contact, action?: ArchiveAction) => { | |
diff --git a/client/src/views/properties/components/PropertyContactsTab/index.tsx b/client/src/views/properties/components/PropertyContactsTab/index.tsx | |
index a7e4ad6f2..bc5e9d3b1 100644 | |
--- a/client/src/views/properties/components/PropertyContactsTab/index.tsx | |
+++ b/client/src/views/properties/components/PropertyContactsTab/index.tsx | |
@@ -14,6 +14,8 @@ import { useEntityById, useEntityListCustom } from "state/entities/hooks"; | |
import { mergeRecords } from "state/entities/util"; | |
import { logEvent } from "util/analytics"; | |
import { propertyEventData } from "services/properties"; | |
+import { useLocation, useNavigate, useParams } from "react-router"; | |
+import { pathForContact, pathForNewContact, pathForProperty } from "RouteURLs"; | |
enum PropertyContactsTabStatus { | |
Default, | |
@@ -26,15 +28,19 @@ interface PropertyContactsTabProps { | |
} | |
export default function PropertyContactsTab(props: PropertyContactsTabProps) { | |
+ const location = useLocation(); | |
+ | |
useEffect(() => logEvent("View Property Contacts", propertyEventData(props.property)), []); | |
const context = useContext(AuthContext); | |
+ const navigate = useNavigate(); | |
+ const params = useParams<"contactId">(); | |
- const [selectedContactId, setSelectedContactId] = useState<number | null>(null); | |
const [status, setStatus] = useState(PropertyContactsTabStatus.Default); | |
const contactStats = useEntityById("contactStats"); | |
const contacts = useEntityListCustom("contacts", "selectByProperty" as const, props.property.id); | |
+ | |
const fullContacts = contacts ? mergeRecords(contacts, contactStats, (c) => c.id) : null; | |
const templateContact = { | |
@@ -43,14 +49,14 @@ export default function PropertyContactsTab(props: PropertyContactsTabProps) { | |
const onRowClick = (ev: any, contact?: Contact) => { | |
if (contact) { | |
+ navigate(pathForContact(contact, "", location.pathname)); | |
setStatus(PropertyContactsTabStatus.ViewingContact); | |
- setSelectedContactId(contact?.id); | |
} | |
}; | |
const onAddContactClick = useCallback(() => { | |
setStatus(PropertyContactsTabStatus.AddingContact); | |
- setSelectedContactId(-1); | |
+ navigate(pathForNewContact("", location.pathname)); | |
}, []); | |
const onCancelAddContact = () => { | |
@@ -63,13 +69,14 @@ export default function PropertyContactsTab(props: PropertyContactsTabProps) { | |
const onCloseContact = () => { | |
setStatus(PropertyContactsTabStatus.Default); | |
+ navigate(pathForProperty(props.property, "contacts")); | |
}; | |
const userCanAddAsset = | |
userHasEntityPermission(context.user, EntityType.Contact, PermissionType.Add) && !props.property.deleted; | |
const selectedContact = | |
- (selectedContactId === -1 ? templateContact : contacts?.find((x) => x.id === selectedContactId)) ?? null; | |
+ (params.contactId === "new" ? templateContact : contacts?.find((x) => x.id + "" === params.contactId + "")) ?? null; | |
return ( | |
<> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment