️ This Gitlab will be shut down at 2021-12-31 23:59:59.
Students and staff can migrate to gitlab.utwente.nl.
SNT members can migrate to gitlab.snt.utwente.nl.
Contact bestuur@snt.utwente.nl for more information.

Migrate your projects today!
Export your project using the webinterface or use a script.

Commit ddbb8b76 authored by TJHeeringa's avatar TJHeeringa

Replaced react-search-input with mui searchbar

parent bb86267b
......@@ -7296,11 +7296,6 @@
"resolved": "https://registry.npmjs.org/functional-red-black-tree/-/functional-red-black-tree-1.0.1.tgz",
"integrity": "sha1-GwqzvVU7Kg1jmdKcDj6gslIHgyc="
},
"fuse.js": {
"version": "3.6.1",
"resolved": "https://registry.npmjs.org/fuse.js/-/fuse.js-3.6.1.tgz",
"integrity": "sha512-hT9yh/tiinkmirKrlv4KWOjztdoZo1mx9Qh4KvWqC7isoXwdUY3PNWUxceF4/qO9R6riA2C29jdTOeQOIROjgw=="
},
"gauge": {
"version": "2.7.4",
"resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
......@@ -10659,6 +10654,15 @@
"escape-string-regexp": "^1.0.4"
}
},
"material-ui-search-bar": {
"version": "1.0.0-beta.14",
"resolved": "https://registry.npmjs.org/material-ui-search-bar/-/material-ui-search-bar-1.0.0-beta.14.tgz",
"integrity": "sha512-K4i4iUi0Dp+iEvcAFc/KmDBS4kOtEY0Kh5ID1RX884PMhKMT9rIJcKkhPhThYPji4cCXc1pz8t5F54VMbhLmcw==",
"requires": {
"classnames": "^2.2.5",
"prop-types": "^15.5.8"
}
},
"md5.js": {
"version": "1.3.5",
"resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
......@@ -17465,15 +17469,6 @@
}
}
},
"react-search-input": {
"version": "0.11.3",
"resolved": "https://registry.npmjs.org/react-search-input/-/react-search-input-0.11.3.tgz",
"integrity": "sha512-Yo05lNR5YLeIY+mTEk0lMkYHX0qkTlElJmxMTw5JlZPu92EP8YWwIY3QSbEFULvX4wiTfyDdUovTUpp2VockpA==",
"requires": {
"fuse.js": "^3.0.0",
"prop-types": "^15.5.8"
}
},
"react-simple-tree-menu": {
"version": "1.1.18",
"resolved": "https://registry.npmjs.org/react-simple-tree-menu/-/react-simple-tree-menu-1.1.18.tgz",
......
import Divider from "@material-ui/core/Divider";
import Typography from "@material-ui/core/Typography";
import SearchBar from "material-ui-search-bar";
import PropTypes from "prop-types";
import React, { useState } from "react";
import Container from "react-bootstrap/esm/Container";
import SearchInput, {createFilter} from "react-search-input";
import { useGet } from "restful-react";
import AssociationCard from "../../Components/Card/AssociationCard";
import CardGrid from "../../Components/Card/CardGrid";
import Block from "../../Components/PageLayout/Content/Block";
import PropTypes from "prop-types";
import MembershipRequest from "./MembershipRequest";
import {NoProfileYetWithRouter} from "../Profile/NoProfileYet";
export const Associations = (props) => {
......@@ -24,10 +23,12 @@ export const Associations = (props) => {
resolve: data => data && data.results
});
const KEYS_TO_FILTER = ["name"];
const KEY_TO_FILTER = "name";
const createFilter = (searchTerm, key) => item=>item[key].toLowerCase().includes(searchTerm.toLowerCase());
const resetSearchTerm = () => setSearchTerm("");
const member_of_associations = association_memberships.map(association_membership=>association_membership.association);
const filteredAssociations = associations ? associations.filter(createFilter(searchTerm, KEYS_TO_FILTER)) : [];
const filteredAssociations = associations ? associations.filter(createFilter(searchTerm, KEY_TO_FILTER)) : [];
const memberOfAssociation = (association) => member_of_associations.find(member_of_association=>member_of_association.slug === association.slug) === undefined;
const associationToCard = (association) => ({
......@@ -53,10 +54,11 @@ export const Associations = (props) => {
<Block>
<Typography variant={"h5"}>Associations</Typography>
<Divider/>
<SearchInput
<SearchBar
placeholder={"Search"}
className={"search-input"}
value={searchTerm}
onChange={setSearchTerm}
onCancelSearch={resetSearchTerm}
/>
</Block>
</Container>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment