fix: index.css/js to styles/script (#44356)

* fix: replace index with script/styles as needed

* fix: remove redundant fileKey

It's overwritten by createPoly, so the parser does not need to create it

* fix: curriculum test suite

* Update client/src/templates/Challenges/classic/MultifileEditor.js

Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>

Co-authored-by: Shaun Hamilton <shauhami020@gmail.com>
This commit is contained in:
Oliver Eyton-Williams
2021-12-03 21:32:29 +01:00
committed by GitHub
parent 7a5e805769
commit f613a1e5fd
14 changed files with 115 additions and 157 deletions

View File

@@ -297,7 +297,7 @@ export type CompletedChallenge = {
};
export type Ext = 'js' | 'html' | 'css' | 'jsx';
export type FileKey = 'indexjs' | 'indexhtml' | 'indexcss';
export type FileKey = 'scriptjs' | 'indexhtml' | 'stylescss';
export type ChallengeMeta = {
block: string;

View File

@@ -40,14 +40,13 @@ const propTypes = {
saveEditorContent: PropTypes.func.isRequired,
setEditorFocusability: PropTypes.func,
theme: PropTypes.string,
// TODO: is this used?
title: PropTypes.string,
updateFile: PropTypes.func.isRequired,
usesMultifileEditor: PropTypes.bool,
visibleEditors: PropTypes.shape({
indexjs: PropTypes.bool,
scriptjs: PropTypes.bool,
indexjsx: PropTypes.bool,
indexcss: PropTypes.bool,
stylescss: PropTypes.bool,
indexhtml: PropTypes.bool
})
};
@@ -83,7 +82,7 @@ const MultifileEditor = props => {
theme,
resizeProps,
title,
visibleEditors: { indexcss, indexhtml, indexjs, indexjsx },
visibleEditors: { stylescss, indexhtml, scriptjs, indexjsx },
usesMultifileEditor
} = props;
const editorTheme = theme === 'night' ? 'vs-dark-custom' : 'vs-custom';
@@ -105,8 +104,8 @@ const MultifileEditor = props => {
if (indexjsx) editorKeys.push('indexjsx');
if (indexhtml) editorKeys.push('indexhtml');
if (indexcss) editorKeys.push('indexcss');
if (indexjs) editorKeys.push('indexjs');
if (stylescss) editorKeys.push('stylescss');
if (scriptjs) editorKeys.push('scriptjs');
const editorAndSplitterKeys = editorKeys.reduce((acc, key) => {
if (acc.length === 0) {

View File

@@ -227,11 +227,11 @@ const transformIncludes = async function (fileP) {
div.querySelector('script[src="./script.js"]');
const importedFiles = [];
if (link) {
importedFiles.push('index.css');
importedFiles.push('styles.css');
link.remove();
}
if (script) {
importedFiles.push('index.js');
importedFiles.push('script.js');
script.remove();
}

View File

@@ -51,17 +51,10 @@ const composeFunctions = (...fns) =>
fns.map(applyFunction).reduce((f, g) => x => f(x).then(g));
function buildSourceMap(challengeFiles) {
// TODO: concatenating the source/contents is a quick hack for multi-file
// editing. It is used because all the files (js, html and css) end up with
// the same name 'index'. This made the last file the only file to appear in
// sources.
// A better solution is to store and handle them separately. Perhaps never
// setting the name to 'index'. Use 'contents' instead?
// TODO: is file.source ever defined?
// TODO: rename sources.index to sources.contents.
const source = challengeFiles.reduce(
(sources, challengeFile) => {
sources[challengeFile.name] +=
challengeFile.source || challengeFile.contents;
sources.index += challengeFile.source || challengeFile.contents;
sources.editableContents += challengeFile.editableContents || '';
return sources;
},