jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui) - create issue mising projectId and added a loader

Browse source
This commit is contained in:
Shekar Siri 2022-10-28 16:32:57 +02:00
parent 397f7defc5
commit 8b3c949526
2 changed files with 99 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

183
frontend/app/components/Session_/Issues/IssueForm.js
View file

@ -1,6 +1,6 @@
import React from 'react';
import { connect } from 'react-redux';
import { Form, Input, Button, CircularLoader } from 'UI';
import { Form, Input, Button, CircularLoader, Loader } from 'UI';
//import { } from 'Duck/issues';
import { addActivity, init, edit, fetchAssignments, fetchMeta } from 'Duck/assignments';
import Select from 'Shared/Select';
@ -57,8 +57,16 @@ class IssueForm extends React.PureComponent {
writeOption = ({ name, value }) => this.props.edit({ [name]: value.value });
render() {
const { creating, projects, users, issueTypes, instance, closeHandler, metaLoading } =
this.props;
const {
creating,
projects,
users,
issueTypes,
instance,
closeHandler,
metaLoading,
projectsLoading,
} = this.props;
const projectOptions = projects.map(({ name, id }) => ({ label: name, value: id })).toArray();
const userOptions = users.map(({ name, id }) => ({ label: name, value: id })).toArray();
@ -68,93 +76,97 @@ class IssueForm extends React.PureComponent {
const selectedIssueType = issueTypes.filter((issue) => issue.id == instance.issueType)[0];
console.log('instance', instance);
return (
<Form onSubmit={this.onSubmit} className="text-left">
<Form.Field className="mb-15-imp">
<label htmlFor="issueType">
<span className="mr-2">Project</span>
<CircularLoader loading={metaLoading} />
</label>
<Select
name="projectId"
options={projectOptions}
// value={ instance.projectId }
fluid
onChange={this.writeOption}
placeholder="Project"
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="issueType">Issue Type</label>
<Select
selection
name="issueType"
labeled
options={issueTypeOptions}
// value={ instance.issueType }
fluid
onChange={this.writeOption}
placeholder="Select issue type"
text={
selectedIssueType ? (
<SelectedValue icon={selectedIssueType.iconUrl} text={selectedIssueType.name} />
) : (
''
)
}
/>
</Form.Field>
<Loader loading={projectsLoading} size={40}>
<Form onSubmit={this.onSubmit} className="text-left">
<Form.Field className="mb-15-imp">
<label htmlFor="issueType" className="flex items-center">
<span className="mr-2">Project</span>
<CircularLoader loading={metaLoading} />
</label>
<Select
name="projectId"
options={projectOptions}
// value={instance.projectId}
fluid
onChange={this.writeOption}
placeholder="Project"
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="issueType">Issue Type</label>
<Select
selection
name="issueType"
labeled
options={issueTypeOptions}
value={instance.issueType}
fluid
onChange={this.writeOption}
placeholder="Select issue type"
text={
selectedIssueType ? (
<SelectedValue icon={selectedIssueType.iconUrl} text={selectedIssueType.name} />
) : (
''
)
}
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="assignee">Assignee</label>
<Select
selection
name="assignee"
options={userOptions}
// value={ instance.assignee }
fluid
onChange={this.writeOption}
placeholder="Select a user"
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="assignee">Assignee</label>
<Select
selection
name="assignee"
options={userOptions}
// value={ instance.assignee }
fluid
onChange={this.writeOption}
placeholder="Select a user"
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="title">Summary</label>
<Input
name="title"
value={instance.title}
placeholder="Issue Title / Summary"
onChange={this.write}
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="title">Summary</label>
<Input
name="title"
value={instance.title}
placeholder="Issue Title / Summary"
onChange={this.write}
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="description">
Description
{/* <span className="text-sm text-gray-500">(Optional)</span> */}
</label>
<textarea
name="description"
rows="2"
value={instance.description}
placeholder="E.g. Found this issue at 3:29secs"
onChange={this.write}
/>
</Form.Field>
<Form.Field className="mb-15-imp">
<label htmlFor="description">
Description
{/* <span className="text-sm text-gray-500">(Optional)</span> */}
</label>
<textarea
name="description"
rows="2"
value={instance.description}
placeholder="E.g. Found this issue at 3:29secs"
onChange={this.write}
/>
</Form.Field>
<Button
loading={creating}
variant="primary"
disabled={!instance.validate()}
className="float-left mr-2"
type="submit"
>
{'Create'}
</Button>
<Button type="button" onClick={closeHandler}>
{'Cancel'}
</Button>
</Form>
<Button
loading={creating}
variant="primary"
disabled={!instance.validate()}
className="float-left mr-2"
type="submit"
>
{'Create'}
</Button>
<Button type="button" onClick={closeHandler}>
{'Cancel'}
</Button>
</Form>
</Loader>
);
}
}
@ -163,6 +175,7 @@ export default connect(
(state) => ({
creating: state.getIn(['assignments', 'addActivity', 'loading']),
projects: state.getIn(['assignments', 'projects']),
projectsLoading: state.getIn(['assignments', 'fetchProjects', 'loading']),
users: state.getIn(['assignments', 'users']),
instance: state.getIn(['assignments', 'instance']),
metaLoading: state.getIn(['assignments', 'fetchMeta', 'loading']),

2
frontend/app/duck/assignments.js
View file

@ -111,7 +111,7 @@ export function addActivity(sessionId, params) {
const data = { ...params, assignee: params.assignee.value, issueType: params.issueType.value }
return {
types: ADD_ACTIVITY.toArray(),
call: client => client.post(`/sessions/${ sessionId }/assign/projects/${params.projectId.value}`, data),
call: client => client.post(`/sessions/${ sessionId }/assign/projects/${params.projectId}`, data),
}
}