Skip to content

Commit 2cdc0b3

Browse files
vtm9vtm9
committed
Fix editor
1 parent 1928521 commit 2cdc0b3

File tree

9 files changed

+273
-3
lines changed

9 files changed

+273
-3
lines changed

‎services/app/apps/codebattle/.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@ erl_crash.dump
2020
# Static artifacts
2121
node_modules
2222

23+
# KaTeX fonts (copied from node_modules)
24+
/assets/static/fonts/katex
25+
2326
# Since we are building assets from web/static,
2427
# we ignore priv/static. You may want to comment
2528
# this depending on your deployment strategy.

‎services/app/apps/codebattle/assets/css/_katex-fonts.scss‎

Lines changed: 182 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,182 @@
1+
// Override KaTeX font paths to use fonts served from our static directory
2+
// This file should be imported AFTER katex.min.css to override the @font-face declarations
3+
4+
@font-face {
5+
font-family: KaTeX_AMS;
6+
font-style: normal;
7+
font-weight: 400;
8+
src: url("/fonts/katex/KaTeX_AMS-Regular.woff2") format("woff2"),
9+
url("/fonts/katex/KaTeX_AMS-Regular.woff") format("woff"),
10+
url("/fonts/katex/KaTeX_AMS-Regular.ttf") format("truetype");
11+
}
12+
13+
@font-face {
14+
font-family: KaTeX_Caligraphic;
15+
font-style: normal;
16+
font-weight: 700;
17+
src: url("/fonts/katex/KaTeX_Caligraphic-Bold.woff2") format("woff2"),
18+
url("/fonts/katex/KaTeX_Caligraphic-Bold.woff") format("woff"),
19+
url("/fonts/katex/KaTeX_Caligraphic-Bold.ttf") format("truetype");
20+
}
21+
22+
@font-face {
23+
font-family: KaTeX_Caligraphic;
24+
font-style: normal;
25+
font-weight: 400;
26+
src: url("/fonts/katex/KaTeX_Caligraphic-Regular.woff2") format("woff2"),
27+
url("/fonts/katex/KaTeX_Caligraphic-Regular.woff") format("woff"),
28+
url("/fonts/katex/KaTeX_Caligraphic-Regular.ttf") format("truetype");
29+
}
30+
31+
@font-face {
32+
font-family: KaTeX_Fraktur;
33+
font-style: normal;
34+
font-weight: 700;
35+
src: url("/fonts/katex/KaTeX_Fraktur-Bold.woff2") format("woff2"),
36+
url("/fonts/katex/KaTeX_Fraktur-Bold.woff") format("woff"),
37+
url("/fonts/katex/KaTeX_Fraktur-Bold.ttf") format("truetype");
38+
}
39+
40+
@font-face {
41+
font-family: KaTeX_Fraktur;
42+
font-style: normal;
43+
font-weight: 400;
44+
src: url("/fonts/katex/KaTeX_Fraktur-Regular.woff2") format("woff2"),
45+
url("/fonts/katex/KaTeX_Fraktur-Regular.woff") format("woff"),
46+
url("/fonts/katex/KaTeX_Fraktur-Regular.ttf") format("truetype");
47+
}
48+
49+
@font-face {
50+
font-family: KaTeX_Main;
51+
font-style: normal;
52+
font-weight: 700;
53+
src: url("/fonts/katex/KaTeX_Main-Bold.woff2") format("woff2"),
54+
url("/fonts/katex/KaTeX_Main-Bold.woff") format("woff"),
55+
url("/fonts/katex/KaTeX_Main-Bold.ttf") format("truetype");
56+
}
57+
58+
@font-face {
59+
font-family: KaTeX_Main;
60+
font-style: italic;
61+
font-weight: 700;
62+
src: url("/fonts/katex/KaTeX_Main-BoldItalic.woff2") format("woff2"),
63+
url("/fonts/katex/KaTeX_Main-BoldItalic.woff") format("woff"),
64+
url("/fonts/katex/KaTeX_Main-BoldItalic.ttf") format("truetype");
65+
}
66+
67+
@font-face {
68+
font-family: KaTeX_Main;
69+
font-style: italic;
70+
font-weight: 400;
71+
src: url("/fonts/katex/KaTeX_Main-Italic.woff2") format("woff2"),
72+
url("/fonts/katex/KaTeX_Main-Italic.woff") format("woff"),
73+
url("/fonts/katex/KaTeX_Main-Italic.ttf") format("truetype");
74+
}
75+
76+
@font-face {
77+
font-family: KaTeX_Main;
78+
font-style: normal;
79+
font-weight: 400;
80+
src: url("/fonts/katex/KaTeX_Main-Regular.woff2") format("woff2"),
81+
url("/fonts/katex/KaTeX_Main-Regular.woff") format("woff"),
82+
url("/fonts/katex/KaTeX_Main-Regular.ttf") format("truetype");
83+
}
84+
85+
@font-face {
86+
font-family: KaTeX_Math;
87+
font-style: italic;
88+
font-weight: 700;
89+
src: url("/fonts/katex/KaTeX_Math-BoldItalic.woff2") format("woff2"),
90+
url("/fonts/katex/KaTeX_Math-BoldItalic.woff") format("woff"),
91+
url("/fonts/katex/KaTeX_Math-BoldItalic.ttf") format("truetype");
92+
}
93+
94+
@font-face {
95+
font-family: KaTeX_Math;
96+
font-style: italic;
97+
font-weight: 400;
98+
src: url("/fonts/katex/KaTeX_Math-Italic.woff2") format("woff2"),
99+
url("/fonts/katex/KaTeX_Math-Italic.woff") format("woff"),
100+
url("/fonts/katex/KaTeX_Math-Italic.ttf") format("truetype");
101+
}
102+
103+
@font-face {
104+
font-family: KaTeX_SansSerif;
105+
font-style: normal;
106+
font-weight: 700;
107+
src: url("/fonts/katex/KaTeX_SansSerif-Bold.woff2") format("woff2"),
108+
url("/fonts/katex/KaTeX_SansSerif-Bold.woff") format("woff"),
109+
url("/fonts/katex/KaTeX_SansSerif-Bold.ttf") format("truetype");
110+
}
111+
112+
@font-face {
113+
font-family: KaTeX_SansSerif;
114+
font-style: italic;
115+
font-weight: 400;
116+
src: url("/fonts/katex/KaTeX_SansSerif-Italic.woff2") format("woff2"),
117+
url("/fonts/katex/KaTeX_SansSerif-Italic.woff") format("woff"),
118+
url("/fonts/katex/KaTeX_SansSerif-Italic.ttf") format("truetype");
119+
}
120+
121+
@font-face {
122+
font-family: KaTeX_SansSerif;
123+
font-style: normal;
124+
font-weight: 400;
125+
src: url("/fonts/katex/KaTeX_SansSerif-Regular.woff2") format("woff2"),
126+
url("/fonts/katex/KaTeX_SansSerif-Regular.woff") format("woff"),
127+
url("/fonts/katex/KaTeX_SansSerif-Regular.ttf") format("truetype");
128+
}
129+
130+
@font-face {
131+
font-family: KaTeX_Script;
132+
font-style: normal;
133+
font-weight: 400;
134+
src: url("/fonts/katex/KaTeX_Script-Regular.woff2") format("woff2"),
135+
url("/fonts/katex/KaTeX_Script-Regular.woff") format("woff"),
136+
url("/fonts/katex/KaTeX_Script-Regular.ttf") format("truetype");
137+
}
138+
139+
@font-face {
140+
font-family: KaTeX_Size1;
141+
font-style: normal;
142+
font-weight: 400;
143+
src: url("/fonts/katex/KaTeX_Size1-Regular.woff2") format("woff2"),
144+
url("/fonts/katex/KaTeX_Size1-Regular.woff") format("woff"),
145+
url("/fonts/katex/KaTeX_Size1-Regular.ttf") format("truetype");
146+
}
147+
148+
@font-face {
149+
font-family: KaTeX_Size2;
150+
font-style: normal;
151+
font-weight: 400;
152+
src: url("/fonts/katex/KaTeX_Size2-Regular.woff2") format("woff2"),
153+
url("/fonts/katex/KaTeX_Size2-Regular.woff") format("woff"),
154+
url("/fonts/katex/KaTeX_Size2-Regular.ttf") format("truetype");
155+
}
156+
157+
@font-face {
158+
font-family: KaTeX_Size3;
159+
font-style: normal;
160+
font-weight: 400;
161+
src: url("/fonts/katex/KaTeX_Size3-Regular.woff2") format("woff2"),
162+
url("/fonts/katex/KaTeX_Size3-Regular.woff") format("woff"),
163+
url("/fonts/katex/KaTeX_Size3-Regular.ttf") format("truetype");
164+
}
165+
166+
@font-face {
167+
font-family: KaTeX_Size4;
168+
font-style: normal;
169+
font-weight: 400;
170+
src: url("/fonts/katex/KaTeX_Size4-Regular.woff2") format("woff2"),
171+
url("/fonts/katex/KaTeX_Size4-Regular.woff") format("woff"),
172+
url("/fonts/katex/KaTeX_Size4-Regular.ttf") format("truetype");
173+
}
174+
175+
@font-face {
176+
font-family: KaTeX_Typewriter;
177+
font-style: normal;
178+
font-weight: 400;
179+
src: url("/fonts/katex/KaTeX_Typewriter-Regular.woff2") format("woff2"),
180+
url("/fonts/katex/KaTeX_Typewriter-Regular.woff") format("woff"),
181+
url("/fonts/katex/KaTeX_Typewriter-Regular.ttf") format("truetype");
182+
}

‎services/app/apps/codebattle/assets/css/_monaco-fonts.scss‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
// Override Monaco Editor codicon font path
2+
// The font is served from /codicon.ttf in both dev and production
3+
4+
@font-face {
5+
font-family: "codicon";
6+
font-display: block;
7+
src: url("/codicon.ttf") format("truetype");
8+
}

‎services/app/apps/codebattle/assets/css/style.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -82,6 +82,7 @@ $cb-grand-slam-bg: rgba(238, 55, 55, 1);
8282
$fa-font-path: "/fonts";
8383

8484
@import "fonts";
85+
@import "monaco-fonts";
8586
@import "tournaments";
8687
@import "grades";
8788

‎services/app/apps/codebattle/assets/js/widgets/pages/game/ContributorsList.jsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,8 +27,9 @@ const renderContributorsList = contributors => (
2727
</ul>
2828
);
2929

30-
function ContributorsList({ name, tags, level }) {
31-
const url = `https://api.github.com/repos/hexlet-codebattle/tasks/commits?path=tasks/${level}/${tags[0]}/${name}.toml`;
30+
function ContributorsList({ task: { name, tags, level } }) {
31+
const url = `https://api.github.com/repos/hexlet-codebattle/tasks/commits?path=tasks/${level}/${tags && tags[0]}/${name}.toml`;
32+
console.log(url);
3233

3334
const dispatch = useDispatch();
3435

@@ -42,6 +43,8 @@ function ContributorsList({ name, tags, level }) {
4243
axios
4344
.get(url)
4445
.then(res => {
46+
console.log(res.data);
47+
console.log(11111);
4548
const authors = res.data.filter(item => item.author);
4649
const contributorsList = authors.map(el => ({
4750
avatarLink: el.author.avatar_url,

‎services/app/apps/codebattle/assets/js/widgets/pages/game/EditorContainer.jsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -250,6 +250,7 @@ function EditorContainer({
250250
userId: id,
251251
wordWrap: 'off',
252252
lineNumbers: 'on',
253+
fontSize: 16,
253254
hidingPanelControls: false,
254255
userType: type,
255256
syntax: editorState?.currentLangSlug || 'js',

‎services/app/apps/codebattle/assets/js/widgets/pages/game/TaskDescriptionMarkdown.jsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import Markdown from 'react-markdown';
44
import rehypeKatex from 'rehype-katex';
55
import remarkMath from 'remark-math';
66
import 'katex/dist/katex.min.css';
7+
import '../../../../css/_katex-fonts.scss';
78

89
const TaskDescriptionMarkdown = ({ description }) => (
910
<Markdown remarkPlugins={[remarkMath]} rehypePlugins={[rehypeKatex]}>

‎services/app/apps/codebattle/lib/codebattle_web/endpoint.ex‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,22 @@ defmodule CodebattleWeb.Endpoint do
5252
from: Path.expand("../../assets/static", __DIR__),
5353
gzip: false
5454
)
55+
56+
# Serve fonts and codicon.ttf at root level for KaTeX and Monaco in dev
57+
plug(
58+
Plug.Static,
59+
at: "/fonts",
60+
from: Path.expand("../../assets/static/fonts", __DIR__),
61+
gzip: false
62+
)
63+
64+
plug(
65+
Plug.Static,
66+
at: "/",
67+
from: Path.expand("../../assets/static", __DIR__),
68+
gzip: false,
69+
only: ~w(codicon.ttf)
70+
)
5571
end
5672

5773
# Code reloading can be explicitly enabled under the

‎services/app/apps/codebattle/vite.config.js‎

Lines changed: 56 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ function forceFullReload() {
3737
};
3838
}
3939

40-
// --- copy codicon font to priv/static for Phoenix to serve
40+
// --- copy codicon font to priv/static for Phoenix to serve (production)
4141
function copyCodiconFont() {
4242
return {
4343
name: "copy-codicon-font",
@@ -55,6 +55,60 @@ function copyCodiconFont() {
5555
};
5656
}
5757

58+
// --- copy KaTeX fonts to assets/static/fonts for dev and priv/static/fonts for prod
59+
function copyKatexFonts() {
60+
return {
61+
name: "copy-katex-fonts",
62+
buildStart() {
63+
const katexFontsDir = path.resolve(__dirname, "node_modules/katex/dist/fonts");
64+
const devDestDir = path.resolve(__dirname, "assets/static/fonts/katex");
65+
66+
try {
67+
if (!fs.existsSync(devDestDir)) {
68+
fs.mkdirSync(devDestDir, { recursive: true });
69+
}
70+
71+
const fonts = fs.readdirSync(katexFontsDir);
72+
for (const font of fonts) {
73+
if (/\.(woff2?|ttf)$/.test(font)) {
74+
fs.copyFileSync(
75+
path.join(katexFontsDir, font),
76+
path.join(devDestDir, font)
77+
);
78+
}
79+
}
80+
console.log("✓ Copied KaTeX fonts to assets/static/fonts/katex/");
81+
} catch (err) {
82+
console.error("Failed to copy KaTeX fonts:", err);
83+
}
84+
},
85+
closeBundle() {
86+
// Also copy to priv/static/fonts/katex for production
87+
const katexFontsDir = path.resolve(__dirname, "node_modules/katex/dist/fonts");
88+
const prodDestDir = path.resolve(__dirname, "priv/static/fonts/katex");
89+
90+
try {
91+
if (!fs.existsSync(prodDestDir)) {
92+
fs.mkdirSync(prodDestDir, { recursive: true });
93+
}
94+
95+
const fonts = fs.readdirSync(katexFontsDir);
96+
for (const font of fonts) {
97+
if (/\.(woff2?|ttf)$/.test(font)) {
98+
fs.copyFileSync(
99+
path.join(katexFontsDir, font),
100+
path.join(prodDestDir, font)
101+
);
102+
}
103+
}
104+
console.log("✓ Copied KaTeX fonts to priv/static/fonts/katex/");
105+
} catch (err) {
106+
console.error("Failed to copy KaTeX fonts:", err);
107+
}
108+
},
109+
};
110+
}
111+
58112
// Re-use your multiple entry points
59113
const input = {
60114
app: path.resolve(__dirname, "assets/js/app.js"),
@@ -89,6 +143,7 @@ export default defineConfig(({ command, mode }) => ({
89143
poLoader(),
90144
forceFullReload(), // always trigger full reload
91145
copyCodiconFont(), // copy codicon font for Phoenix to serve
146+
copyKatexFonts(), // copy KaTeX fonts for serving
92147
environment(["NODE_ENV"]),
93148
],
94149

0 commit comments

Comments
 (0)