clear filter invite table

Author: archies-coder

src/features/Invites/InviteView.tsx

@@ -97,6 +97,14 @@ const useStyles = makeStyles((theme: Theme) =>
                 },
             },
         },
+        label: {
+            textTransform: 'capitalize'
+        },
+        buttonRoot: {
+            backgroundColor: 'white',
+            boxShadow: 'none',
+            borderRadius: theme.shape.borderRadius - 5
+        }
     })
 )
 
@@ -257,6 +265,12 @@ const InviteView: FunctionComponent<Props> = (props) => {
                             }} variant="contained" style={{ marginTop: '33px', marginLeft: '27px', height: '40px'}}>In Office</Button> */}
                     <SelectInput style={{ marginLeft: '27px' }} onChange={(e: any) => { debugger; handleFilterChange({ purpose: e.target.value }) }} menuOptions={purpose.map(item => ({ title: item }))} defaultValue="All Purpose" value={filter.purpose} />
                     <SelectInput style={{ marginLeft: '27px' }} onChange={(e: any) => { debugger; handleFilterChange({ site: e.target.value }) }} menuOptions={sites.map(item => ({ title: item.sitename }))} defaultValue="All Sites" value={filter.site} />
+                    <Button onClick={() => {  handleFilterChange({ site: "", purpose: "", visitor: "" }) }}
+                        classes={{
+                            root: classes.buttonRoot, // class name, e.g. `classes-nesting-root-x`
+                            label: classes.label, // class name, e.g. `classes-nesting-label-x`
+                        }} variant="contained" style={{ marginLeft: '27px', height: '40px' }}
+                    >Clear Filter</Button>
                 </Box>
                 <TableWrapper config={TableConfig} style={{ marginTop: '17px', marginLeft: '43px', marginRight: '300px' }} />
             </Paper>