Skip to content

Commit ba89b1a

Browse files
olewandowski1olewandowski1
committed
feat: make filter responsive
1 parent f275ef7 commit ba89b1a

4 files changed

Lines changed: 22 additions & 21 deletions

File tree

‎src/components/ContractContributionDetailsFilter.jsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React, { Component } from "react"
22
import { injectIntl } from 'react-intl';
33
import { connect } from "react-redux";
4-
import { formatMessage, TextInput, PublishedComponent, decodeId } from "@openimis/fe-core";
4+
import { formatMessage, TextInput, PublishedComponent, decodeId, GRID_RESPONSIVE_STANDARD } from "@openimis/fe-core";
55
import { Grid } from "@mui/material";
66
import { useTheme, styled } from "@mui/material/styles";
77
import { STARTS_WITH_LOOKUP } from "../constants"
@@ -30,7 +30,7 @@ class ContractContributionDetailsFilter extends Component {
3030
const { intl, onChangeFilters, policyHolder } = this.props;
3131
return (
3232
<StyledGrid container className="form">
33-
<StyledGrid size={3} className="item">
33+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
3434
<TextInput
3535
module="contract"
3636
label="insureeChfId"
@@ -42,7 +42,7 @@ class ContractContributionDetailsFilter extends Component {
4242
}])}
4343
/>
4444
</StyledGrid>
45-
<StyledGrid size={3} className="item">
45+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
4646
<PublishedComponent
4747
pubRef="policyHolder.PolicyHolderContributionPlanBundlePicker"
4848
withNull
@@ -56,7 +56,7 @@ class ContractContributionDetailsFilter extends Component {
5656
}])}
5757
/>
5858
</StyledGrid>
59-
<StyledGrid size={3} className="item">
59+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
6060
<PublishedComponent
6161
pubRef="contributionPlan.ContributionPlanPicker"
6262
withNull
@@ -69,7 +69,7 @@ class ContractContributionDetailsFilter extends Component {
6969
}])}
7070
/>
7171
</StyledGrid>
72-
<StyledGrid size={3} className="item">
72+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
7373
<PublishedComponent
7474
pubRef="product.ProductPicker"
7575
withNull={true}

‎src/components/ContractDetailsFilter.jsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import {
77
TextInput,
88
PublishedComponent,
99
decodeId,
10+
GRID_RESPONSIVE_STANDARD,
1011
} from "@openimis/fe-core";
1112
import { Grid } from "@mui/material";
1213
import { styled } from "@mui/material/styles";
@@ -38,7 +39,7 @@ class ContractDetailsFilter extends Component {
3839

3940
return (
4041
<StyledGrid container className="form">
41-
<Grid size={3} className="item">
42+
<Grid size={GRID_RESPONSIVE_STANDARD} className="item">
4243
<TextInput
4344
module="contract"
4445
label="insureeChfId"
@@ -55,7 +56,7 @@ class ContractDetailsFilter extends Component {
5556
/>
5657
</Grid>
5758

58-
<Grid size={3} className="item">
59+
<Grid size={GRID_RESPONSIVE_STANDARD} className="item">
5960
<PublishedComponent
6061
pubRef="policyHolder.PolicyHolderContributionPlanBundlePicker"
6162
withNull

‎src/components/ContractFilter.jsx‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React, { Component } from "react"
22
import { injectIntl } from 'react-intl';
3-
import { withModulesManager, formatMessage, TextInput, NumberInput, PublishedComponent } from "@openimis/fe-core";
3+
import { withModulesManager, formatMessage, TextInput, NumberInput, PublishedComponent, GRID_RESPONSIVE_STANDARD, GRID_RESPONSIVE_SMALL } from "@openimis/fe-core";
44
import { Grid, FormControlLabel, Checkbox } from "@mui/material";
55
import { useTheme, styled } from "@mui/material/styles";
66
import { DATE_TO_DATETIME_SUFFIX, GREATER_OR_EQUAL_LOOKUP, LESS_OR_EQUAL_LOOKUP, CONTAINS_LOOKUP, MIN_AMENDMENT_VALUE } from "../constants"
@@ -69,7 +69,7 @@ class ContractFilter extends Component {
6969
const { intl, onChangeFilters } = this.props;
7070
return (
7171
<StyledGrid container className="form">
72-
<StyledGrid size={2} className="item">
72+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
7373
<TextInput
7474
module="contract"
7575
label="code"
@@ -78,7 +78,7 @@ class ContractFilter extends Component {
7878
/>
7979
</StyledGrid>
8080
{!this.isFilteredByDefaultPolicyHolder && (
81-
<StyledGrid size={2} className="item">
81+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
8282
<PublishedComponent
8383
pubRef="policyHolder.PolicyHolderPicker"
8484
module="contract"
@@ -93,7 +93,7 @@ class ContractFilter extends Component {
9393
/>
9494
</StyledGrid>
9595
)}
96-
<StyledGrid size={2} className="item">
96+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
9797
<NumberInput
9898
module="contract"
9999
label="amountFrom"
@@ -105,7 +105,7 @@ class ContractFilter extends Component {
105105
}])}
106106
/>
107107
</StyledGrid>
108-
<StyledGrid size={2} className="item">
108+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
109109
<NumberInput
110110
module="contract"
111111
label="amountTo"
@@ -117,7 +117,7 @@ class ContractFilter extends Component {
117117
}])}
118118
/>
119119
</StyledGrid>
120-
<StyledGrid size={2} className="item">
120+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
121121
<PublishedComponent
122122
pubRef="core.DatePicker"
123123
module="contract"
@@ -130,7 +130,7 @@ class ContractFilter extends Component {
130130
}])}
131131
/>
132132
</StyledGrid>
133-
<StyledGrid size={2} className="item">
133+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
134134
<ContractStatePicker
135135
module="contract"
136136
label="state"
@@ -140,15 +140,15 @@ class ContractFilter extends Component {
140140
nullLabel={formatMessage(intl, "contract", "any")}
141141
/>
142142
</StyledGrid>
143-
<StyledGrid size={2} className="item">
143+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
144144
<TextInput
145145
module="contract"
146146
label="paymentReference"
147147
value={this._filterTextFieldValue('paymentReference')}
148148
onChange={v => this._onChangeStringFilter('paymentReference', v, CONTAINS_LOOKUP)}
149149
/>
150150
</StyledGrid>
151-
<StyledGrid size={2} className="item">
151+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
152152
<NumberInput
153153
module="contract"
154154
label="amendment"
@@ -157,7 +157,7 @@ class ContractFilter extends Component {
157157
onChange={v => this._onChangeFilter('amendment', !!v ? v : null)}
158158
/>
159159
</StyledGrid>
160-
<StyledGrid size={2} className="item">
160+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
161161
<PublishedComponent
162162
pubRef="core.DatePicker"
163163
module="contract"
@@ -166,7 +166,7 @@ class ContractFilter extends Component {
166166
onChange={v => this._onChangeDateFilter('dateValidFrom', v, GREATER_OR_EQUAL_LOOKUP)}
167167
/>
168168
</StyledGrid>
169-
<StyledGrid size={2} className="item">
169+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
170170
<PublishedComponent
171171
pubRef="core.DatePicker"
172172
module="contract"
@@ -175,7 +175,7 @@ class ContractFilter extends Component {
175175
onChange={v => this._onChangeDateFilter('dateValidTo', v, LESS_OR_EQUAL_LOOKUP)}
176176
/>
177177
</StyledGrid>
178-
<StyledGrid size={2} className="item">
178+
<StyledGrid size={GRID_RESPONSIVE_SMALL} className="item">
179179
<FormControlLabel
180180
control={<Checkbox
181181
checked={!!this._filterValue('isDeleted')}

‎src/components/ContractInsureePolicyFilter.jsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { Component } from "react"
2-
import { PublishedComponent } from "@openimis/fe-core";
2+
import { PublishedComponent, GRID_RESPONSIVE_STANDARD } from "@openimis/fe-core";
33
import { Grid } from "@mui/material";
44
import { useTheme, styled } from "@mui/material/styles";
55

@@ -17,7 +17,7 @@ class ContractInsureePolicyFilter extends Component {
1717
const { filters, onChangeFilters } = this.props;
1818
return (
1919
<StyledGrid container className="form">
20-
<StyledGrid size={3} className="item">
20+
<StyledGrid size={GRID_RESPONSIVE_STANDARD} className="item">
2121
<PublishedComponent
2222
pubRef="insuree.InsureePicker"
2323
value={!!filters["insuree_ChfId"] ? filters["insuree_ChfId"].value : null}

0 commit comments

Comments
 (0)