Skip to content

Commit 15486a6

Browse files
committed
Merge branch 'main' into yogesh-xxx-add-codecov-badge
2 parents 3c302ed + f3d2893 commit 15486a6

File tree

16 files changed

+520
-63
lines changed

16 files changed

+520
-63
lines changed

.github/workflows/backend-ci.yml

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,11 @@ on:
44
push:
55
paths:
66
- chartlets.py/**
7+
branches:
8+
- main
9+
pull_request:
10+
paths:
11+
- chartlets.py/**
712

813
jobs:
914
backend:
@@ -21,11 +26,13 @@ jobs:
2126
shell: bash -l {0}
2227
run: |
2328
cd chartlets.py
24-
pytest --cov=chartlets.py --cov-report=xml
29+
pytest --cov=chartlets --cov-report=xml
2530
2631
- name: Upload coverage reports to Codecov
2732
uses: codecov/codecov-action@v4
2833
with:
34+
fail_ci_if_error: true
2935
directory: chartlets.py/
36+
flags: backend
3037
verbose: true
3138
token: ${{ secrets.CODECOV_TOKEN }}

.github/workflows/frontend-ci.yml

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,11 @@ on:
44
push:
55
paths:
66
- chartlets.js/**
7+
branches:
8+
- main
9+
pull_request:
10+
paths:
11+
- chartlets.js/**
712

813
jobs:
914
frontend:
@@ -40,7 +45,9 @@ jobs:
4045
- name: Upload coverage reports for lib to Codecov
4146
uses: codecov/codecov-action@v4
4247
with:
43-
directory: chartlets.js/packages/lib/
48+
fail_ci_if_error: true
49+
directory: chartlets.js/packages/lib/coverage/
50+
flags: frontend
4451
verbose: true
4552
token: ${{ secrets.CODECOV_TOKEN }}
4653

Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
name: Package and Publish
1+
name: Package and Publish to PyPi
22

33
on:
44
release:
@@ -36,14 +36,19 @@ jobs:
3636
# exit-zero treats all errors as warnings. The GitHub editor is 127 chars wide
3737
flake8 . --count --exit-zero --max-complexity=10 --max-line-length=127 --statistics
3838
39-
- name: Test with pytest
39+
- name: Run unit tests
40+
shell: bash -l {0}
4041
run: |
41-
pytest --cov=chartlets
42-
42+
pytest --cov=chartlets --cov-report=xml
43+
4344
- name: Upload coverage reports to Codecov
44-
uses: codecov/codecov-action@v3
45-
env:
46-
CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
45+
uses: codecov/codecov-action@v4
46+
with:
47+
fail_ci_if_error: true
48+
directory: chartlets.py/
49+
flags: backend
50+
verbose: true
51+
token: ${{ secrets.CODECOV_TOKEN }}
4752

4853
PyPi-Deploy:
4954
name: Publish Python Package to PyPI
@@ -77,57 +82,3 @@ jobs:
7782
password: ${{ secrets.PYPI_API_TOKEN }}
7883
packages_dir: chartlets.py/dist
7984
verbose: true
80-
81-
npm-tests:
82-
runs-on: ubuntu-latest
83-
strategy:
84-
matrix:
85-
node-version: [16.x, 18.x, 20.x]
86-
# See supported Node.js release schedule at
87-
# https://nodejs.org/en/about/releases/
88-
defaults:
89-
run:
90-
working-directory: chartlets.js
91-
92-
steps:
93-
- uses: actions/checkout@v3
94-
- name: Use Node.js ${{ matrix.node-version }}
95-
uses: actions/setup-node@v3
96-
with:
97-
node-version: ${{ matrix.node-version }}
98-
cache: 'npm'
99-
cache-dependency-path: chartlets.js/package-lock.json
100-
101-
- run: npm ci
102-
- run: npm run lint
103-
- run: npm run build
104-
- run: npm run test
105-
106-
npm-Deploy:
107-
name: Publish TS-React Package to npmjs
108-
runs-on: ubuntu-latest
109-
needs: npm-tests
110-
defaults:
111-
run:
112-
working-directory: chartlets.js
113-
114-
steps:
115-
- uses: actions/checkout@v4
116-
117-
- name: Set up Node.js
118-
uses: actions/setup-node@v4
119-
with:
120-
node-version: '18.x'
121-
registry-url: 'https://registry.npmjs.org'
122-
cache: 'npm'
123-
cache-dependency-path: chartlets.js/package-lock.json
124-
125-
- run: npm ci
126-
- run: |
127-
cd packages/lib
128-
npm run build
129-
- run: |
130-
cd packages/lib
131-
npm publish --access public
132-
env:
133-
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
name: Package and Publish to NPM
2+
3+
on:
4+
release:
5+
types: [published]
6+
workflow_dispatch:
7+
8+
jobs:
9+
npm-tests-lib:
10+
runs-on: ubuntu-latest
11+
strategy:
12+
matrix:
13+
node-version: [16.x, 18.x, 20.x]
14+
# See supported Node.js release schedule at
15+
# https://nodejs.org/en/about/releases/
16+
defaults:
17+
run:
18+
working-directory: chartlets.js/packages/lib
19+
20+
steps:
21+
- uses: actions/checkout@v3
22+
- name: Use Node.js ${{ matrix.node-version }}
23+
uses: actions/setup-node@v3
24+
with:
25+
node-version: ${{ matrix.node-version }}
26+
cache: 'npm'
27+
cache-dependency-path: chartlets.js/package-lock.json
28+
29+
- run: npm ci
30+
- run: npm run lint
31+
- run: npm run test
32+
33+
- run: npm run coverage
34+
- name: Upload coverage reports for lib to Codecov
35+
uses: codecov/codecov-action@v4
36+
with:
37+
fail_ci_if_error: true
38+
directory: coverage/
39+
flags: frontend
40+
verbose: true
41+
token: ${{ secrets.CODECOV_TOKEN }}
42+
43+
- run: npm run build
44+
45+
npm-tests-demo:
46+
runs-on: ubuntu-latest
47+
strategy:
48+
matrix:
49+
node-version: [16.x, 18.x, 20.x]
50+
# See supported Node.js release schedule at
51+
# https://nodejs.org/en/about/releases/
52+
defaults:
53+
run:
54+
working-directory: chartlets.js/packages/demo
55+
56+
steps:
57+
- uses: actions/checkout@v3
58+
- name: Use Node.js ${{ matrix.node-version }}
59+
uses: actions/setup-node@v3
60+
with:
61+
node-version: ${{ matrix.node-version }}
62+
cache: 'npm'
63+
cache-dependency-path: chartlets.js/package-lock.json
64+
65+
- run: npm ci
66+
- run: npm run lint
67+
- run: npm run build
68+
69+
npm-deploy:
70+
name: Publish TS-React Package to npmjs
71+
runs-on: ubuntu-latest
72+
needs: [npm-tests-lib, npm-tests-demo]
73+
defaults:
74+
run:
75+
working-directory: chartlets.js/packages/lib
76+
77+
steps:
78+
- uses: actions/checkout@v4
79+
80+
- name: Set up Node.js
81+
uses: actions/setup-node@v4
82+
with:
83+
node-version: '18.x'
84+
registry-url: 'https://registry.npmjs.org'
85+
cache: 'npm'
86+
cache-dependency-path: chartlets.js/package-lock.json
87+
88+
- run: npm ci
89+
- run: npm run build
90+
- run: npm publish --access public
91+
env:
92+
NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

chartlets.js/CHANGES.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,9 @@
3939

4040
* New (MUI) components
4141
- `LinearProgress`
42+
- `RadioGroup` and `Radio`
4243
- `Switch`
44+
- `Tabs`
4345

4446
* Supporting `tooltip` property for interactive MUI components.
4547

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import { describe, it, expect } from "vitest";
2+
import { render, screen, fireEvent } from "@testing-library/react";
3+
import { createChangeHandler } from "./common.test";
4+
import { RadioGroup } from "./RadioGroup";
5+
6+
describe("RadioGroup", () => {
7+
it("should render the component", () => {
8+
render(
9+
<RadioGroup
10+
id="rg"
11+
type={"RadioGroup"}
12+
label={"Gender"}
13+
value={"f"}
14+
children={[
15+
{ type: "Radio", value: "f", label: "Female" },
16+
{ type: "Radio", value: "m", label: "Male" },
17+
{ type: "Radio", value: "v", label: "Varying" },
18+
]}
19+
onChange={() => {}}
20+
row
21+
dense
22+
/>,
23+
);
24+
// to inspect rendered component, do:
25+
// expect(document.querySelector("#rg")).toEqual({});
26+
expect(screen.getByRole("radiogroup")).not.toBeUndefined();
27+
});
28+
29+
it("should fire 'value' property with text options", () => {
30+
const { recordedEvents, onChange } = createChangeHandler();
31+
render(
32+
<RadioGroup
33+
id="rg"
34+
type={"RadioGroup"}
35+
label={"Gender"}
36+
value={"m"}
37+
children={[
38+
{ type: "Radio", value: "f", label: "Female" },
39+
{ type: "Radio", value: "m", label: "Male" },
40+
{ type: "Radio", value: "v", label: "Varying" },
41+
]}
42+
onChange={onChange}
43+
/>,
44+
);
45+
fireEvent.click(screen.getByLabelText("Varying"));
46+
expect(recordedEvents.length).toBe(1);
47+
expect(recordedEvents[0]).toEqual({
48+
componentType: "RadioGroup",
49+
id: "rg",
50+
property: "value",
51+
value: "v",
52+
});
53+
fireEvent.click(screen.getByLabelText("Female"));
54+
expect(recordedEvents.length).toBe(2);
55+
expect(recordedEvents[1]).toEqual({
56+
componentType: "RadioGroup",
57+
id: "rg",
58+
property: "value",
59+
value: "f",
60+
});
61+
});
62+
});
Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
import { type ChangeEvent } from "react";
2+
import MuiRadio from "@mui/material/Radio";
3+
import MuiRadioGroup from "@mui/material/RadioGroup";
4+
import MuiFormControl from "@mui/material/FormControl";
5+
import MuiFormControlLabel from "@mui/material/FormControlLabel";
6+
import MuiFormLabel from "@mui/material/FormLabel";
7+
import { Tooltip } from "./Tooltip";
8+
9+
import type { ComponentState, ComponentProps } from "@/index";
10+
11+
interface RadioState extends ComponentState {
12+
type: "Radio";
13+
value?: boolean | number | string | undefined;
14+
label?: string;
15+
size?: "medium" | "small" | string;
16+
}
17+
18+
interface RadioGroupState extends ComponentState {
19+
children?: RadioState[];
20+
label?: string;
21+
row?: boolean;
22+
dense?: boolean;
23+
tooltip?: string;
24+
}
25+
26+
interface RadioGroupProps extends ComponentProps, RadioGroupState {}
27+
28+
export function RadioGroup({
29+
type,
30+
id,
31+
name,
32+
value,
33+
disabled,
34+
style,
35+
label,
36+
row,
37+
tooltip,
38+
dense,
39+
children: radioButtons,
40+
onChange,
41+
}: RadioGroupProps) {
42+
const handleChange = (
43+
_event: ChangeEvent<HTMLInputElement>,
44+
value: string,
45+
) => {
46+
if (id) {
47+
return onChange({
48+
componentType: type,
49+
id: id,
50+
property: "value",
51+
value,
52+
});
53+
}
54+
};
55+
return (
56+
<Tooltip title={tooltip}>
57+
<MuiFormControl style={style} disabled={disabled}>
58+
<MuiFormLabel>{label}</MuiFormLabel>
59+
<MuiRadioGroup
60+
id={id}
61+
name={name}
62+
row={row}
63+
value={value}
64+
onChange={handleChange}
65+
>
66+
{radioButtons &&
67+
radioButtons.map((radioButton) => (
68+
<MuiFormControlLabel
69+
value={radioButton.value}
70+
label={radioButton.label}
71+
disabled={radioButton.disabled}
72+
control={
73+
<MuiRadio
74+
id={radioButton.id}
75+
size={dense ? "small" : "medium"}
76+
/>
77+
}
78+
/>
79+
))}
80+
</MuiRadioGroup>
81+
</MuiFormControl>
82+
</Tooltip>
83+
);
84+
}

0 commit comments

Comments
 (0)