55 lines
1.5 KiB
JavaScript
55 lines
1.5 KiB
JavaScript
import React from "react";
|
|
import { connect } from "react-redux";
|
|
import Box from '@mui/material/Box';
|
|
import InputLabel from '@mui/material/InputLabel';
|
|
import MenuItem from '@mui/material/MenuItem';
|
|
import FormControl from '@mui/material/FormControl';
|
|
import Select from '@mui/material/Select';
|
|
|
|
function ProjectList(props) {
|
|
function handleSelectProject(id) {
|
|
props.dispatch({ type: "SELECT_PROJECT", id });
|
|
}
|
|
|
|
const loadedProjects = props.projects
|
|
const loadedProjectID = props.selectedProjectId
|
|
console.log(loadedProjects)
|
|
return (
|
|
<>
|
|
<div>
|
|
<Box sx={{ minWidth: 100 }}>
|
|
<FormControl fullWidth>
|
|
<InputLabel id="demo-simple-select-label">Projects</InputLabel>
|
|
<Select
|
|
labelId="demo-simple-select-label"
|
|
id="demo-simple-select"
|
|
// value={JSON.stringify(loadedProjectID)}
|
|
label="Projects"
|
|
>
|
|
{loadedProjects.map(({ projectId, projectName }) => (
|
|
<MenuItem
|
|
key={projectId}
|
|
onClick={() => handleSelectProject(projectId)}
|
|
value={projectName}
|
|
// className={loadedProjectID === projectId ? "selected" : ""}
|
|
>
|
|
{projectName}
|
|
</MenuItem>
|
|
))}
|
|
</Select>
|
|
</FormControl>
|
|
</Box>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default connect(mapStateToProps)(ProjectList);
|
|
|
|
function mapStateToProps(state) {
|
|
return {
|
|
projects: state.projectsReducer.projects,
|
|
selectedProjectId: state.projectsReducer.selectedProjectId,
|
|
};
|
|
}
|