Skip to content

Commit 1650052

Browse files
committed
history reintegration
1 parent 27801ab commit 1650052

File tree

4 files changed

+105
-99
lines changed

4 files changed

+105
-99
lines changed

src/client/components-v2/App.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ const App = () => {
3939
<Box sx={{ height: '100%', display: 'flex' }}>
4040
{/* New MUI workspace. */}
4141
{/* <WorkspaceContainer currentWorkspaceId={currentWorkspaceId} setWorkspace={setWorkspace} /> */}
42-
<HistoryOrWorkspaceContainer currentWorkspaceId={currentWorkspaceId} setWorkspace={setWorkspace} />
42+
{/* <HistoryOrWorkspaceContainer currentWorkspaceId={currentWorkspaceId} setWorkspace={setWorkspace} /> */}
4343
{/* Legacy workspace. */}
4444
<ContentsContainer />
4545
<Divider orientation="vertical"/>

src/client/components/containers/CollectionsContainer.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ function CollectionsContainer() {
4545
return (
4646
<div>
4747
<div className="mt-3 is-flex is-flex-direction-row is-justify-content-center is-align-items-center">
48-
<button
48+
{/* <button
4949
className={`button is-medium is-primary ${
5050
isDark ? '' : 'is-outlined'
5151
} button-padding-verticals mx-3`}
@@ -55,20 +55,20 @@ function CollectionsContainer() {
5555
}
5656
>
5757
Import from Files
58-
</button>
59-
<button
58+
</button> */}
59+
{/* <button
6060
className={`button is-medium is-primary ${
6161
isDark ? '' : 'is-outlined'
6262
} button-padding-verticals mx-3`}
6363
type="button"
6464
onClick={handleImportFromGithub}
6565
>
6666
Import from Github
67-
</button>
67+
</button> */}
6868
<ul>
69-
{files.map((file) => (
69+
{/* {files.map((file) => (
7070
<li key={file.repository.full_name}>{file.repository.name}</li>
71-
))}
71+
))} */}
7272
</ul>
7373
<hr />
7474
</div>
Lines changed: 93 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -1,87 +1,93 @@
1-
import React, { useState } from 'react';
2-
import { useSelector, useDispatch } from 'react-redux';
3-
import * as uiactions from './../../features/ui/uiSlice';
4-
import BarGraph from '../display/BarGraph';
5-
import WorkspaceContainer from './WorkspaceContainer';
6-
import ScheduleContainer from './ScheduleContainer';
7-
import CollectionsContainer from './CollectionsContainer';
8-
9-
const ContentsContainer = () => {
10-
const dispatch = useDispatch();
11-
const activeTab = useSelector((store) => store.ui.workspaceActiveTab);
12-
const currentResponse = useSelector(
13-
(store) => store.business.currentResponse
14-
);
15-
const isDark = useSelector((store) => store.ui.isDark);
16-
17-
const setActiveTab = (tabName: string) =>
18-
dispatch(uiactions.setWorkspaceActiveTab(tabName));
19-
20-
const [showGraph, setShowGraph] = useState(false);
21-
22-
return (
23-
<div
24-
// className={`${isDark ? 'is-dark-400 dark-divider' : 'is-divider-neutral-300'} column is-tall is-one-third is-flex is-flex-direction-column`} // gigi playing with css
25-
className={`${isDark ? 'is-dark-400 dark-divider' : 'is-divider-neutral-300'} box is-3 is-tall add-vertical-scroll`}
26-
id="workspace"
27-
style={{margin: "10px", maxHeight: "98vh"}}
28-
>
29-
{/* HEADER */}
30-
<div className="hero is-primary has-text-centered">
31-
<h3>Workspace</h3>
32-
</div>
33-
34-
{/* TAB SELECTOR */}
35-
<div className="tabs header-bar">
36-
<ul className={`columns is-gapless ${isDark ? 'dark-divider' : ''}`}>
37-
<li
38-
className={`column ${activeTab === 'workspace' ? 'is-active' : ''}`}
39-
>
40-
<a onClick={() => setActiveTab('workspace')}>Requests</a>
41-
</li>
42-
<li
43-
className={`column ${
44-
activeTab === 'saved-workspace' ? 'is-active' : ''
45-
}`}
46-
>
47-
<a onClick={() => setActiveTab('saved-workspace')}>
48-
Saved Workspace
49-
</a>
50-
</li>
51-
<li
52-
className={`column ${activeTab === 'schedule' ? 'is-active' : ''}`}
53-
>
54-
<a onClick={() => setActiveTab('schedule')}>Schedule</a>
55-
</li>
56-
</ul>
57-
</div>
58-
59-
{/* WORKSPACE CONTENT */}
60-
<div className="is-flex-grow-3 add-vertical-scroll">
61-
{activeTab === 'workspace' && <WorkspaceContainer />}
62-
63-
{activeTab === 'saved-workspace' && <CollectionsContainer />}
64-
65-
{activeTab === 'schedule' && <ScheduleContainer />}
66-
</div>
67-
68-
{/* BARGRAPH CONTENT */}
69-
{currentResponse.id && (
70-
<div
71-
className={`is-flex is-align-items-center is-justify-content-center is-graph-footer is-clickable`}
72-
onClick={() => setShowGraph(showGraph === false)}
73-
>
74-
{showGraph && 'Hide Response History'}
75-
{!showGraph && 'View Response History'}
76-
</div>
77-
)}
78-
{showGraph && (
79-
<div>
80-
<BarGraph />
81-
</div>
82-
)}
83-
</div>
84-
);
85-
};
86-
87-
export default ContentsContainer;
1+
import React, { useState } from 'react';
2+
import { useSelector, useDispatch } from 'react-redux';
3+
import * as uiactions from './../../features/ui/uiSlice';
4+
import BarGraph from '../display/BarGraph';
5+
import WorkspaceContainer from './WorkspaceContainer';
6+
import ScheduleContainer from './ScheduleContainer';
7+
import CollectionsContainer from './CollectionsContainer';
8+
import HistoryContainer from './HistoryContainer';
9+
10+
11+
const ContentsContainer = () => {
12+
const dispatch = useDispatch();
13+
const activeTab = useSelector((store) => store.ui.workspaceActiveTab);
14+
const currentResponse = useSelector(
15+
(store) => store.business.currentResponse
16+
);
17+
const isDark = useSelector((store) => store.ui.isDark);
18+
19+
const setActiveTab = (tabName: string) =>
20+
dispatch(uiactions.setWorkspaceActiveTab(tabName));
21+
22+
const [showGraph, setShowGraph] = useState(false);
23+
24+
return (
25+
<div
26+
// className={`${isDark ? 'is-dark-400 dark-divider' : 'is-divider-neutral-300'} column is-tall is-one-third is-flex is-flex-direction-column`} // gigi playing with css
27+
className={`${isDark ? 'is-dark-400 dark-divider' : 'is-divider-neutral-300'} box is-3 is-tall add-vertical-scroll`}
28+
id="workspace"
29+
style={{margin: "10px", maxHeight: "98vh", width: '26vw'}}
30+
>
31+
{/* HEADER */}
32+
<div className="hero is-primary has-text-centered">
33+
<h3>Workspace</h3>
34+
</div>
35+
36+
{/* TAB SELECTOR */}
37+
<div className="tabs header-bar">
38+
<ul className={`columns is-gapless ${isDark ? 'dark-divider' : ''}`}>
39+
<li
40+
className={`column ${activeTab === 'workspace' ? 'is-active' : ''}`}
41+
>
42+
<a onClick={() => setActiveTab('workspace')}>Requests</a>
43+
</li>
44+
<li
45+
className={`column ${activeTab === 'history' ? 'is-active' : ''}`}
46+
>
47+
<a onClick={() => setActiveTab('history')}>History</a>
48+
</li>
49+
<li
50+
className={`column ${activeTab === 'saved' ? 'is-active' : ''}`}
51+
>
52+
<a onClick={() => setActiveTab('saved')}>
53+
Saved
54+
</a>
55+
</li>
56+
<li
57+
className={`column ${activeTab === 'schedule' ? 'is-active' : ''}`}
58+
>
59+
<a onClick={() => setActiveTab('schedule')}>Schedule</a>
60+
</li>
61+
</ul>
62+
</div>
63+
{/* WORKSPACE CONTENT */}
64+
<div className="is-flex-grow-3 add-vertical-scroll">
65+
{activeTab === 'workspace' && <WorkspaceContainer />}
66+
67+
{activeTab === 'history' && <HistoryContainer />}
68+
69+
{activeTab === 'saved' && <CollectionsContainer />}
70+
71+
{activeTab === 'schedule' && <ScheduleContainer />}
72+
</div>
73+
74+
{/* BARGRAPH CONTENT */}
75+
{currentResponse.id && (
76+
<div
77+
className={`is-flex is-align-items-center is-justify-content-center is-graph-footer is-clickable`}
78+
onClick={() => setShowGraph(showGraph === false)}
79+
>
80+
{showGraph && 'Hide Response History'}
81+
{!showGraph && 'View Response History'}
82+
</div>
83+
)}
84+
{showGraph && (
85+
<div>
86+
<BarGraph />
87+
</div>
88+
)}
89+
</div>
90+
);
91+
};
92+
93+
export default ContentsContainer;

src/client/components/containers/HistoryContainer.jsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -68,15 +68,15 @@ const HistoryContainer = (props) => {
6868
});
6969

7070
return (
71-
<div
72-
className={`p-3 is-flex is-flex-direction-column is-tall-not-5rem ${isDark ? 'is-dark-400' : ''}`}
71+
<span
72+
className={`p-3 is-flex is-flex-direction-column is-tall-not-1rem ${isDark ? 'is-dark-400' : ''}`}
7373
id="history-container"
7474
>
75-
<div>
75+
<span id="history-container"className="is-flex is-flex-direction-row is-justify-content-space-around is-align-items-center mt-3">
7676
<ClearHistoryBtn clearHistory={clearHistory} />
77-
</div>
77+
</span>
7878
<div className="add-vertical-scroll">{historyDates}</div>
79-
</div>
79+
</span>
8080
);
8181
};
8282

0 commit comments

Comments
 (0)