fix really really annoying bug

client/modules/IDE/actions/project.js

@@ -29,7 +29,6 @@ export function getProject(id) {
           type: ActionTypes.SET_PROJECT,
           project: response.data,
           files: response.data.files,
-          selectedFile: response.data.selectedFile,
           owner: response.data.user
         });
         getProjectBlobUrls()(dispatch, getState);
@@ -85,7 +84,6 @@ export function saveProject() {
             name: response.data.name,
             id: response.data.id,
             owner: response.data.user,
-            selectedFile: response.data.selectedFile,
             files: response.data.files
           });
         })
@@ -108,7 +106,6 @@ export function createProject() {
           name: response.data.name,
           id: response.data.id,
           owner: response.data.user,
-          selectedFile: response.data.selectedFile,
           files: response.data.files
         });
       })

client/modules/IDE/components/FileNode.js

@@ -6,7 +6,6 @@ import { connect } from 'react-redux';
 import InlineSVG from 'react-inlinesvg';
 const downArrowUrl = require('../../../images/down-arrow.svg');
 import classNames from 'classnames';
-import { setSelectedFile } from '../reducers/files';
 
 export class FileNode extends React.Component {
   constructor(props) {
@@ -152,7 +151,7 @@ FileNode.propTypes = {
 };
 
 function mapStateToProps(state, ownProps) {
-  return setSelectedFile(state.files, state.ide.selectedFile || state.files[1].id).find((file) => file.id === ownProps.id);
+  return state.files.find((file) => file.id === ownProps.id);
 }
 
 function mapDispatchToProps(dispatch) {

client/modules/IDE/components/Sidebar.js

@@ -67,7 +67,7 @@ class Sidebar extends React.Component {
             />
           )}
         </ul> */ }
-        <ConnectedFileNode id={'0'} />
+        <ConnectedFileNode id={this.props.files.filter(file => file.name === 'root')[0].id} />
       </nav>
     );
   }

client/modules/IDE/pages/IDEView.js

@@ -16,12 +16,11 @@ import * as ProjectActions from '../actions/project';
 import * as EditorAccessibilityActions from '../actions/editorAccessibility';
 import * as PreferencesActions from '../actions/preferences';
 import * as UserActions from '../../User/actions';
-import { getFile, getHTMLFile, getJSFiles, getCSSFiles, setSelectedFile } from '../reducers/files';
+import { getHTMLFile, getJSFiles, getCSSFiles } from '../reducers/files';
 import SplitPane from 'react-split-pane';
 import Overlay from '../../App/components/Overlay';
 import SketchList from '../components/SketchList';
 import About from '../components/About';
-import { setDefaultSelectedFile } from '../reducers/ide';
 
 class IDEView extends React.Component {
   constructor(props) {
@@ -376,12 +375,12 @@ IDEView.propTypes = {
 
 function mapStateToProps(state) {
   return {
-    files: setSelectedFile(state.files, state.ide.selectedFile),
-    selectedFile: getFile(state.files, state.ide.selectedFile || state.files[1].id),
+    files: state.files,
+    selectedFile: state.files.filter(file => file.isSelected)[0],
     htmlFile: getHTMLFile(state.files),
     jsFiles: getJSFiles(state.files),
     cssFiles: getCSSFiles(state.files),
-    ide: setDefaultSelectedFile(state.ide, state.files),
+    ide: state.ide,
     preferences: state.preferences,
     editorAccessibility: state.editorAccessibility,
     user: state.user,

client/modules/IDE/reducers/files.js

@@ -36,26 +36,32 @@ function initialState() {
   const a = objectID().toHexString();
   const b = objectID().toHexString();
   const c = objectID().toHexString();
+  const r = objectID().toHexString();
   return [
     {
       name: 'root',
-      id: '0',
+      id: r,
+      _id: r,
       children: [a, b, c]
     },
     {
       name: 'sketch.js',
       content: defaultSketch,
-      id: a
+      id: a,
+      _id: a,
+      isSelected: true
     },
     {
       name: 'index.html',
       content: defaultHTML,
-      id: b
+      id: b,
+      _id: b
     },
     {
       name: 'style.css',
       content: defaultCSS,
-      id: c
+      id: c,
+      _id: c
     }];
 }
 
@@ -137,20 +143,18 @@ const files = (state, action) => {
 
         return Object.assign({}, file, { isEditingName: false });
       });
+    case ActionTypes.SET_SELECTED_FILE:
+      return state.map(file => {
+        if (file.id === action.selectedFile) {
+          return Object.assign({}, file, { isSelected: true });
+        }
+        return Object.assign({}, file, { isSelected: false });
+      });
     default:
       return state;
   }
 };
 
-export const setSelectedFile = (state, id) =>
-  state.map(file => {
-    if (file.id === id) {
-      return Object.assign({}, file, { isSelected: true });
-    }
-    return file;
-  });
-
-export const getFile = (state, id) => state.filter(file => file.id === id)[0];
 export const getHTMLFile = (state) => state.filter(file => file.name.match(/.*\.html$/i))[0];
 export const getJSFiles = (state) => state.filter(file => file.name.match(/.*\.js$/i));
 export const getCSSFiles = (state) => state.filter(file => file.name.match(/.*\.css$/i));

client/modules/IDE/reducers/ide.js

@@ -25,10 +25,6 @@ const ide = (state = initialState, action) => {
       return Object.assign({}, state, { isTextOutputPlaying: true });
     case ActionTypes.STOP_TEXT_OUTPUT:
       return Object.assign({}, state, { isTextOutputPlaying: false });
-    case ActionTypes.SET_SELECTED_FILE:
-    case ActionTypes.SET_PROJECT:
-    case ActionTypes.NEW_PROJECT:
-      return Object.assign({}, state, { selectedFile: action.selectedFile });
     case ActionTypes.CONSOLE_EVENT:
       return Object.assign({}, state, { consoleEvent: action.event });
     case ActionTypes.SHOW_MODAL:
@@ -54,15 +50,4 @@ const ide = (state = initialState, action) => {
   }
 };
 
-export const setDefaultSelectedFile = (state, files) => {
-  if (!state.selectedFile) {
-    files.forEach((file) => {
-      if (file.name !== 'root') {
-        state.selectedFile = file.id; // eslint-disable-line
-      }
-    });
-  }
-  return state;
-};
-
 export default ide;

server/models/project.js

@@ -38,7 +38,8 @@ const fileSchema = new Schema({
   content: { type: String },
   url: { type: String },
   children: { type: [ String ], default: [] },
-  fileType: { type: String }
+  fileType: { type: String },
+  isSelected: { type: Boolean }
 }, { timestamps: true, _id: true });
 
 fileSchema.virtual('id').get(function(){
@@ -53,8 +54,7 @@ const projectSchema = new Schema({
   name: { type: String, default: "Hello p5.js, it's the server" },
   user: { type: Schema.Types.ObjectId, ref: 'User' },
   files: { type: [ fileSchema ] },
-  _id: { type: String, default: shortid.generate },
-  selectedFile: Schema.Types.ObjectId
+  _id: { type: String, default: shortid.generate }
 }, { timestamps: true });
 
 projectSchema.virtual('id').get(function(){
@@ -65,21 +65,18 @@ projectSchema.set('toJSON', {
     virtuals: true
 });
 
-projectSchema.pre('save', function createSelectedFile(next) {
-  const project = this;
-  if (!project.selectedFile) {
-    project.selectedFile = project.files[0]._id; // eslint-disable-line no-underscore-dangle
-    return next();
-  }
-  if (project.isNew && project.files.length === 0) {
-    let a = new ObjectId();
-    let b = new ObjectId();
-    let c = new ObjectId();
-    project.files = [{ name: 'sketch.js', content: defaultSketch, _id: a },
-    { name: 'index.html', content: defaultHTML, _id: b },
-    { name: 'style.css', content: defaultCSS, _id: c },
-    { name: 'root', _id: '0', children: [a, b, c] }];
-  }
-});
+// projectSchema.pre('save', function createSelectedFile(next) {
+//   const project = this;
+//   if (project.isNew && project.files.length === 0) {
+//     let a = new ObjectId();
+//     let b = new ObjectId();
+//     let c = new ObjectId();
+//     project.files = [{ name: 'sketch.js', content: defaultSketch, _id: a, isSelected: true },
+//     { name: 'index.html', content: defaultHTML, _id: b },
+//     { name: 'style.css', content: defaultCSS, _id: c },
+//     { name: 'root', _id: new ObjectId(), children: [a, b, c] }];
+//   }
+//   return next();
+// });
 
 export default mongoose.model('Project', projectSchema);