refactor: files{} -> challengeFiles[], and key -> fileKey (#43023)

* fix(client): fix client

* fix propType and add comment

* revert user.json prettification

* slight type refactor and payload correction

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* update ChallengeFile type imports

* add cypress test for code-storage

* update test and storage epic

* fix Shaun's tired brain's logic

* refactor with suggestions

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* update codeReset

* increate cypress timeout because firefox is slow

* remove unused import to make linter happy

* use focus on editor

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* use more specific seletor for cypress editor test

* account for silly null challengeFiles

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

utils/__fixtures__/challenges.js

@@ -1,50 +1,50 @@
-exports.challengeFiles = {
-  indexcss: {
+exports.challengeFiles = [
+  {
     contents: 'some css',
     error: null,
     ext: 'css',
     head: '',
     history: ['index.css'],
-    key: 'indexcss',
+    fileKey: 'indexcss',
     name: 'index',
     path: 'index.css',
     seed: 'some css',
     tail: ''
   },
-  indexhtml: {
+  {
     contents: 'some html',
     error: null,
     ext: 'html',
     head: '',
     history: ['index.html'],
-    key: 'indexhtml',
+    fileKey: 'indexhtml',
     name: 'index',
     path: 'index.html',
     seed: 'some html',
     tail: ''
   },
-  indexjs: {
+  {
     contents: 'some js',
     error: null,
     ext: 'js',
     head: '',
     history: ['index.js'],
-    key: 'indexjs',
+    fileKey: 'indexjs',
     name: 'index',
     path: 'index.js',
     seed: 'some js',
     tail: ''
   },
-  indexjsx: {
+  {
     contents: 'some jsx',
     error: null,
     ext: 'jsx',
     head: '',
     history: ['index.jsx'],
-    key: 'indexjsx',
+    fileKey: 'indexjsx',
     name: 'index',
     path: 'index.jsx',
     seed: 'some jsx',
     tail: ''
   }
-};
+];

utils/polyvinyl.js

@@ -37,7 +37,7 @@ function createPoly({ name, ext, contents, history, ...rest } = {}) {
     name,
     ext,
     path: name + '.' + ext,
-    key: name + ext,
+    fileKey: name + ext,
     contents,
     error: null
   };
@@ -81,7 +81,7 @@ function setExt(ext, poly) {
     ...poly,
     ext,
     path: poly.name + '.' + ext,
-    key: poly.name + ext
+    fileKey: poly.name + ext
   };
   newPoly.history = [...poly.history, newPoly.path];
   return newPoly;

utils/sort-files.js

@@ -1,5 +1,5 @@
 exports.toSortedArray = function toSortedArray(challengeFiles) {
-  const xs = Object.values(challengeFiles);
+  const xs = challengeFiles;
   // TODO: refactor this to use an ext array ['html', 'js', 'css'] and loop over
   // that.
   xs.sort((a, b) => {

utils/sort-files.test.js

@@ -9,14 +9,14 @@ describe('sort-files', () => {
     });
     it('should not modify the challenges', () => {
       const sorted = toSortedArray(challengeFiles);
-      const expected = Object.values(challengeFiles);
+      const expected = challengeFiles;
       expect(sorted).toEqual(expect.arrayContaining(expected));
       expect(sorted.length).toEqual(expected.length);
     });
 
     it('should sort the objects into html, js, css order', () => {
-      const sorted = toSortedArray(challengeFiles);
-      const sortedKeys = sorted.map(({ key }) => key);
+      const sorted = challengeFiles;
+      const sortedKeys = sorted.map(({ fileKey }) => fileKey);
       const expected = ['indexhtml', 'indexjsx', 'indexjs', 'indexcss'];
       expect(sortedKeys).toStrictEqual(expected);
     });