diff --git a/client/constants.js b/client/constants.js index 77b7e35e24..0ef97b4ea4 100644 --- a/client/constants.js +++ b/client/constants.js @@ -101,3 +101,6 @@ export const ERROR = 'ERROR'; export const JUST_OPENED_PROJECT = 'JUST_OPENED_PROJECT'; export const RESET_JUST_OPENED_PROJECT = 'RESET_JUST_OPENED_PROJECT'; + +export const SET_PROJECT_SAVED_TIME = 'SET_PROJECT_SAVED_TIME'; +export const RESET_PROJECT_SAVED_TIME = 'RESET_PROJECT_SAVED_TIME'; diff --git a/client/modules/IDE/actions/ide.js b/client/modules/IDE/actions/ide.js index a31b989d62..8696e42be7 100644 --- a/client/modules/IDE/actions/ide.js +++ b/client/modules/IDE/actions/ide.js @@ -207,3 +207,16 @@ export function resetJustOpenedProject() { type: ActionTypes.RESET_JUST_OPENED_PROJECT }; } + +export function setProjectSavedTime(value) { + return { + type: ActionTypes.SET_PROJECT_SAVED_TIME, + value + }; +} + +export function resetProjectSavedTime() { + return { + type: ActionTypes.RESET_PROJECT_SAVED_TIME, + }; +} diff --git a/client/modules/IDE/actions/project.js b/client/modules/IDE/actions/project.js index 8e2fc4f3f8..d2de3c375b 100644 --- a/client/modules/IDE/actions/project.js +++ b/client/modules/IDE/actions/project.js @@ -2,13 +2,18 @@ import * as ActionTypes from '../../../constants'; import { browserHistory } from 'react-router'; import axios from 'axios'; import { showToast, setToastText } from './toast'; -import { setUnsavedChanges, justOpenedProject, resetJustOpenedProject } from './ide'; +import { setUnsavedChanges, justOpenedProject, resetJustOpenedProject, setProjectSavedTime, resetProjectSavedTime } from './ide'; +import moment from 'moment'; const ROOT_URL = location.href.indexOf('localhost') > 0 ? 'http://localhost:8000/api' : '/api'; export function getProject(id) { - return (dispatch) => { + return (dispatch, getState) => { + const state = getState(); dispatch(justOpenedProject()); + if (state.ide.justOpenedProject) { + dispatch(resetProjectSavedTime()); + } axios.get(`${ROOT_URL}/projects/${id}`, { withCredentials: true }) .then(response => { // browserHistory.push(`/projects/${id}`); @@ -46,6 +51,7 @@ export function saveProject(autosave = false) { axios.put(`${ROOT_URL}/projects/${state.project.id}`, formParams, { withCredentials: true }) .then(() => { dispatch(setUnsavedChanges(false)); + dispatch(setProjectSavedTime(moment().format())); dispatch({ type: ActionTypes.PROJECT_SAVE_SUCCESS }); @@ -69,6 +75,7 @@ export function saveProject(autosave = false) { axios.post(`${ROOT_URL}/projects`, formParams, { withCredentials: true }) .then(response => { dispatch(setUnsavedChanges(false)); + dispatch(setProjectSavedTime(moment().format())); browserHistory.push(`/projects/${response.data.id}`); dispatch({ type: ActionTypes.NEW_PROJECT, diff --git a/client/modules/IDE/components/Editor.jsx b/client/modules/IDE/components/Editor.jsx index 874245ac34..e90d1c1991 100644 --- a/client/modules/IDE/components/Editor.jsx +++ b/client/modules/IDE/components/Editor.jsx @@ -28,6 +28,7 @@ const downArrowUrl = require('../../../images/down-arrow.svg'); import classNames from 'classnames'; import { debounce } from 'lodash'; +import Timer from '../components/Timer'; class Editor extends React.Component { constructor(props) { @@ -158,6 +159,13 @@ class Editor extends React.Component { role="main" className={editorSectionClass} > +
+ {this.props.file.name} + {this.props.unsavedChanges ? '*' : null} + +