Skip to content

Commit a341093

Browse files
vladislavkeblyshvladislavkeblysh
committed
feat: mathjax for formules formatting
1 parent 64b57df commit a341093

File tree

8 files changed

+28119
-5773
lines changed

8 files changed

+28119
-5773
lines changed

‎.eslintrc.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,20 +7,20 @@ const config = createConfig('eslint', {
77
'import/no-named-as-default-member': 'off',
88
'import/no-import-module-exports': 'off',
99
'import/no-self-import': 'off',
10-
'spaced-comment': ['error', 'always', { 'block': { 'exceptions': ['*'] } }],
10+
'spaced-comment': ['error', 'always', { block: { exceptions: ['*'] } }],
1111
'react-hooks/rules-of-hooks': 'off',
12-
"react/forbid-prop-types": ["error", { "forbid": ["any", "array"] }], // arguable object proptype is use when I do not care about the shape of the object
12+
'react/forbid-prop-types': ['error', { forbid: ['any', 'array'] }], // arguable object proptype is use when I do not care about the shape of the object
1313
'no-import-assign': 'off',
1414
'no-promise-executor-return': 'off',
1515
'import/no-cycle': 'off',
1616
},
1717
});
1818

1919
config.settings = {
20-
"import/resolver": {
20+
'import/resolver': {
2121
node: {
22-
paths: ["src", "node_modules"],
23-
extensions: [".js", ".jsx"],
22+
paths: ['src', 'node_modules'],
23+
extensions: ['.js', '.jsx'],
2424
},
2525
},
2626
};

‎package-lock.json‎

Lines changed: 28031 additions & 5704 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@
3939
"@testing-library/user-event": "^14.0.0",
4040
"@zip.js/zip.js": "^2.4.6",
4141
"axios": "^0.28.0",
42+
"better-react-mathjax": "^2.0.3",
4243
"classnames": "^2.3.1",
4344
"core-js": "3.35.1",
4445
"dompurify": "^2.3.1",

‎src/App.jsx‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
33
import { connect } from 'react-redux';
44
import { BrowserRouter as Router } from 'react-router-dom';
55

6-
import FooterSlot from '@openedx/frontend-slot-footer';
6+
// import FooterSlot from '@openedx/frontend-slot-footer';
77
import { LearningHeader as Header } from '@edx/frontend-component-header';
88

99
import { selectors } from 'data/redux';
@@ -12,6 +12,8 @@ import DemoWarning from 'containers/DemoWarning';
1212
import CTA from 'containers/CTA';
1313
import NotificationsBanner from 'containers/NotificationsBanner';
1414
import ListView from 'containers/ListView';
15+
// eslint-disable-next-line import/no-extraneous-dependencies
16+
import { MathJaxContext } from 'better-react-mathjax';
1517

1618
import './App.scss';
1719
import Head from './components/Head';
@@ -30,9 +32,11 @@ export const App = ({ courseMetadata, isEnabled }) => (
3032
<CTA />
3133
<NotificationsBanner />
3234
<main data-testid="main">
33-
<ListView />
35+
<MathJaxContext>
36+
<ListView />
37+
</MathJaxContext>
3438
</main>
35-
<FooterSlot />
39+
{/* <FooterSlot /> */}
3640
</div>
3741
</Router>
3842
);

‎src/App.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ $fa-font-path: "~font-awesome/fonts";
99

1010
$input-focus-box-shadow: $input-box-shadow; // hack to get upgrade to paragon 4.0.0 to work
1111

12-
@import "~@edx/frontend-component-footer/dist/_footer";
12+
//@import "~@edx/frontend-component-footer/dist/_footer";
1313

1414
#root {
1515
display: flex;

‎src/__snapshots__/App.test.jsx.snap‎

Lines changed: 43 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,50 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`App router component snapshot: disabled (show demo warning) 1`] = `
4-
<BrowserRouter>
5-
<div>
6-
<Head />
7-
<Header
8-
courseNumber="course-number"
9-
courseOrg="course-org"
10-
courseTitle="course-title"
11-
data-testid="header"
12-
/>
13-
<DemoWarning />
14-
<CTA />
15-
<NotificationsBanner />
16-
<main
17-
data-testid="main"
18-
>
19-
<ListView />
20-
</main>
21-
<FooterSlot />
22-
</div>
23-
</BrowserRouter>
4+
<MathJaxContext>
5+
<BrowserRouter>
6+
<div>
7+
<Head />
8+
<Header
9+
courseNumber="course-number"
10+
courseOrg="course-org"
11+
courseTitle="course-title"
12+
data-testid="header"
13+
/>
14+
<DemoWarning />
15+
<CTA />
16+
<NotificationsBanner />
17+
<main
18+
data-testid="main"
19+
>
20+
<ListView />
21+
</main>
22+
<FooterSlot />
23+
</div>
24+
</BrowserRouter>
25+
</MathJaxContext>
2426
`;
2527

2628
exports[`App router component snapshot: enabled 1`] = `
27-
<BrowserRouter>
28-
<div>
29-
<Head />
30-
<Header
31-
courseNumber="course-number"
32-
courseOrg="course-org"
33-
courseTitle="course-title"
34-
data-testid="header"
35-
/>
36-
<CTA />
37-
<NotificationsBanner />
38-
<main
39-
data-testid="main"
40-
>
41-
<ListView />
42-
</main>
43-
<FooterSlot />
44-
</div>
45-
</BrowserRouter>
29+
<MathJaxContext>
30+
<BrowserRouter>
31+
<div>
32+
<Head />
33+
<Header
34+
courseNumber="course-number"
35+
courseOrg="course-org"
36+
courseTitle="course-title"
37+
data-testid="header"
38+
/>
39+
<CTA />
40+
<NotificationsBanner />
41+
<main
42+
data-testid="main"
43+
>
44+
<ListView />
45+
</main>
46+
<FooterSlot />
47+
</div>
48+
</BrowserRouter>
49+
</MathJaxContext>
4650
`;

‎src/containers/ResponseDisplay/__snapshots__/index.test.jsx.snap‎

Lines changed: 22 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,18 @@ exports[`ResponseDisplay component snapshot file upload disable with valid respo
44
<div
55
className="response-display"
66
>
7-
<Card
8-
key="0"
9-
>
10-
<Card.Section
11-
className="response-display-text-content"
12-
data-testid="response-display-text-content"
7+
<MathJax>
8+
<Card
9+
key="0"
1310
>
14-
parsed html (sanitized (some text response here))
15-
</Card.Section>
16-
</Card>
11+
<Card.Section
12+
className="response-display-text-content"
13+
data-testid="response-display-text-content"
14+
>
15+
parsed html (sanitized (some text response here))
16+
</Card.Section>
17+
</Card>
18+
</MathJax>
1719
</div>
1820
`;
1921

@@ -70,16 +72,18 @@ exports[`ResponseDisplay component snapshot file upload enable with valid respon
7072
]
7173
}
7274
/>
73-
<Card
74-
key="0"
75-
>
76-
<Card.Section
77-
className="response-display-text-content"
78-
data-testid="response-display-text-content"
75+
<MathJax>
76+
<Card
77+
key="0"
7978
>
80-
parsed html (sanitized (some text response here))
81-
</Card.Section>
82-
</Card>
79+
<Card.Section
80+
className="response-display-text-content"
81+
data-testid="response-display-text-content"
82+
>
83+
parsed html (sanitized (some text response here))
84+
</Card.Section>
85+
</Card>
86+
</MathJax>
8387
</div>
8488
`;
8589

‎src/containers/ResponseDisplay/index.jsx‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
33
import { connect } from 'react-redux';
4+
// eslint-disable-next-line import/no-extraneous-dependencies
5+
import { MathJax } from 'better-react-mathjax';
46

57
import { Card } from '@openedx/paragon';
68

@@ -47,9 +49,13 @@ export class ResponseDisplay extends React.Component {
4749
{
4850
/* eslint-disable react/no-array-index-key */
4951
this.textContents.map((textContent, index) => (
50-
<Card key={index}>
51-
<Card.Section className="response-display-text-content" data-testid="response-display-text-content">{textContent}</Card.Section>
52-
</Card>
52+
<MathJax>
53+
<Card key={index}>
54+
<Card.Section className="response-display-text-content" data-testid="response-display-text-content">
55+
{textContent}
56+
</Card.Section>
57+
</Card>
58+
</MathJax>
5359
))
5460
}
5561
</div>

0 commit comments

Comments
 (0)