From c104dee6459a50b392755c767eabad0e27e09ad9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafael=20L=C3=A1szl=C3=B3?= <rlacko99@gmail.com>
Date: Sat, 12 Dec 2020 17:00:54 +0100
Subject: [PATCH] Updated Group components interface to implement
 routecomponent

---
 client/src/components/admin/group/GroupDocuments.tsx | 8 ++++++--
 client/src/components/admin/group/GroupItems.tsx     | 7 ++++++-
 client/src/components/admin/group/GroupMembers.tsx   | 8 ++++++--
 client/src/components/admin/group/GroupRentals.tsx   | 8 ++++++--
 client/src/components/admin/group/GroupStorages.tsx  | 6 +++++-
 5 files changed, 29 insertions(+), 8 deletions(-)

diff --git a/client/src/components/admin/group/GroupDocuments.tsx b/client/src/components/admin/group/GroupDocuments.tsx
index 92f2889..675166d 100644
--- a/client/src/components/admin/group/GroupDocuments.tsx
+++ b/client/src/components/admin/group/GroupDocuments.tsx
@@ -1,11 +1,15 @@
+import { RouteComponentProps, useLocation } from 'react-router-dom';
+
 import React from 'react';
-import { useLocation } from 'react-router-dom';
 
 function useQuery() {
   return new URLSearchParams(useLocation().search);
 }
 
-export const GroupDocuments: React.FC = () => {
+type TParams = { id: string };
+
+export const GroupDocuments: React.FC<RouteComponentProps<TParams>> = ({ match }) => {
   const query = useQuery();
+  console.log(match.params.id);
   return <>ordered by = {query.get('order_by') || 'none'}</>;
 };
diff --git a/client/src/components/admin/group/GroupItems.tsx b/client/src/components/admin/group/GroupItems.tsx
index e990b13..649f27c 100644
--- a/client/src/components/admin/group/GroupItems.tsx
+++ b/client/src/components/admin/group/GroupItems.tsx
@@ -1,4 +1,9 @@
 import React from 'react';
-export const GroupItems: React.FC = () => {
+import { RouteComponentProps } from 'react-router-dom';
+
+type TParams = { id: string };
+
+export const GroupItems: React.FC<RouteComponentProps<TParams>> = ({ match }) => {
+  console.log(match.params.id);
   return <>items</>;
 };
diff --git a/client/src/components/admin/group/GroupMembers.tsx b/client/src/components/admin/group/GroupMembers.tsx
index 9efab89..04797f0 100644
--- a/client/src/components/admin/group/GroupMembers.tsx
+++ b/client/src/components/admin/group/GroupMembers.tsx
@@ -1,11 +1,15 @@
+import { RouteComponentProps, useLocation } from 'react-router-dom';
+
 import React from 'react';
-import { useLocation } from 'react-router-dom';
 
 function useQuery() {
   return new URLSearchParams(useLocation().search);
 }
 
-export const GroupMembers: React.FC = () => {
+type TParams = { id: string };
+
+export const GroupMembers: React.FC<RouteComponentProps<TParams>> = ({ match }) => {
   const query = useQuery();
+  console.log(match.params.id);
   return <>filtered role = {query.get('role') || 'none'}</>;
 };
diff --git a/client/src/components/admin/group/GroupRentals.tsx b/client/src/components/admin/group/GroupRentals.tsx
index 824d737..3492ca2 100644
--- a/client/src/components/admin/group/GroupRentals.tsx
+++ b/client/src/components/admin/group/GroupRentals.tsx
@@ -1,11 +1,15 @@
+import { RouteComponentProps, useLocation } from 'react-router-dom';
+
 import React from 'react';
-import { useLocation } from 'react-router-dom';
 
 function useQuery() {
   return new URLSearchParams(useLocation().search);
 }
 
-export const GroupRentals: React.FC = () => {
+type TParams = { id: string };
+
+export const GroupRentals: React.FC<RouteComponentProps<TParams>> = ({ match }) => {
   const query = useQuery();
+  console.log(match.params.id);
   return <>filtered state = {query.get('state') || 'none'}</>;
 };
diff --git a/client/src/components/admin/group/GroupStorages.tsx b/client/src/components/admin/group/GroupStorages.tsx
index f926adb..08d4620 100644
--- a/client/src/components/admin/group/GroupStorages.tsx
+++ b/client/src/components/admin/group/GroupStorages.tsx
@@ -1,5 +1,9 @@
 import React from 'react';
+import { RouteComponentProps } from 'react-router-dom';
 
-export const GroupStorages: React.FC = () => {
+type TParams = { id: string };
+
+export const GroupStorages: React.FC<RouteComponentProps<TParams>> = ({ match }) => {
+  console.log(match.params.id);
   return <>storages</>;
 };
-- 
GitLab