diff --git a/src/client/index.scss b/src/client/index.scss index c2ae35d..e3e9715 100644 --- a/src/client/index.scss +++ b/src/client/index.scss @@ -200,6 +200,8 @@ select { padding: 0.75em; } .close { + background-color: transparent; + border: none; color: #999999; padding: 0.25em; visibility: hidden; diff --git a/src/client/resources.jsx b/src/client/resources.jsx index 50dfb91..fd63831 100644 --- a/src/client/resources.jsx +++ b/src/client/resources.jsx @@ -11,7 +11,10 @@ import { } from 'react-tabs'; import Resource from './resource'; -import {setActiveResourceUri} from './state'; +import { + closeResource, + setActiveResourceUri, +} from './state'; const decorate = compose( contempo(require('./resources.raw.scss')), @@ -32,7 +35,16 @@ const Resources = (props) => { {uri} - + ))} diff --git a/src/client/state.js b/src/client/state.js index cca33e9..f6867ff 100644 --- a/src/client/state.js +++ b/src/client/state.js @@ -35,6 +35,20 @@ const slice = createSlice({ resourceUris: [], }, reducers: { + closeResource: (state, {payload: uri}) => { + const index = state.resourceUris.indexOf(uri); + if (-1 !== index) { + state.resourceUris.splice(index, 1); + if (state.resourceUris.length > 0) { + state.activeResourceUri = state.resourceUris[ + Math.min(state.resourceUris.length - 1, index) + ]; + } + else { + state.activeResourceUri = ''; + } + } + }, setActiveResourceUri: (state, {payload: uri}) => { state.activeResourceUri = uri; if (-1 === state.resourceUris.indexOf(uri)) { @@ -51,6 +65,7 @@ const slice = createSlice({ }); export const { + closeResource, setActiveResourceUri, setActiveSidebarIndex, setIsSidebarExpanded,