Skip to content

Commit b38c46c

Browse files
authored
Merge pull request #14 from oslabs-beta/RachTeoFrontendTS
All Files Converted to Typescript
2 parents 29c124a + ca27ae5 commit b38c46c

File tree

15 files changed

+101
-59
lines changed

15 files changed

+101
-59
lines changed

__tests__/componentReducer.test.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -174,7 +174,7 @@ describe('componentReducer Test', () => {
174174
expect(state.canvasFocus.childId).toEqual(null);
175175
});
176176
});
177-
177+
178178
// TEST 'UPDATE CSS'
179179
xdescribe('updateCss', () => {
180180
it('should add style to focused component', () => {
@@ -193,7 +193,7 @@ describe('componentReducer Test', () => {
193193
const styledComp = state.components.find(
194194
(comp) => comp.id === state.canvasFocus.componentId
195195
);
196-
console.log('styledcomp',styledComp.style)
196+
console.log('styledcomp',styledComp)
197197
// expect the style property on targeted comp to equal style property in payload
198198
if (styledComp) {
199199
expect(styledComp.style.backgroundColor).toEqual(

app/src/components/top/NavBarButtons.js renamed to app/src/components/top/NavBarButtons.tsx

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,33 @@
11
import React from 'react';
2-
import store from '../../redux/store.ts';
2+
import store from '../../redux/store';
33
import { Link } from 'react-router-dom';
44
import { useSelector, useDispatch } from 'react-redux';
55
import List from '@mui/material/List';
66
import ListItem from '@mui/material/ListItem';
77
import ListItemText from '@mui/material/ListItemText';
8-
import { resetAllState } from '../../redux/reducers/slice/appStateSlice.ts';
9-
import createModal from '../right/createModal.tsx';
10-
import ExportButton from '../right/ExportButton.tsx';
11-
import { setStyle } from '../../redux/reducers/slice/styleSlice.ts';
12-
import LoginButton from '../right/LoginButton.tsx';
8+
import { resetAllState } from '../../redux/reducers/slice/appStateSlice';
9+
import createModal from '../right/createModal';
10+
import ExportButton from '../right/ExportButton';
11+
import { setStyle } from '../../redux/reducers/slice/styleSlice';
12+
import LoginButton from '../right/LoginButton';
1313
import withStyles from '@mui/styles/withStyles';
1414
import MenuItem from '@mui/material/MenuItem';
1515
import makeStyles from '@mui/styles/makeStyles';
1616
import createStyles from '@mui/styles/createStyles';
17-
import SaveProjectButton from '../right/SaveProjectButton.tsx';
18-
import ProjectsFolder from '../right/OpenProjects.tsx';
19-
import DeleteProjects from '../right/DeleteProjects.tsx';
17+
import SaveProjectButton from '../right/SaveProjectButton';
18+
import ProjectsFolder from '../right/OpenProjects';
19+
import DeleteProjects from '../right/DeleteProjects';
2020
import Menu from '@mui/material/Menu';
21-
import { changeRoom } from '../../redux/reducers/slice/roomCodeSlice.ts';
21+
import { changeRoom } from '../../redux/reducers/slice/roomCodeSlice';
2222
// for websockets
2323
import debounce from 'lodash/debounce';
2424
// websocket front end starts here
2525
import { io } from 'socket.io-client';
26-
import { toggleDarkMode } from '../../redux/reducers/slice/darkModeSlice.ts';
27-
import { allCooperativeState } from '../../redux/reducers/slice/appStateSlice.ts';
28-
import { codePreviewCooperative } from '../../redux/reducers/slice/codePreviewSlice.ts';
29-
import { cooperativeStyle } from '../../redux/reducers/slice/styleSlice.ts';
30-
import config from '../../../../config.js';
26+
import { toggleDarkMode } from '../../redux/reducers/slice/darkModeSlice';
27+
import { allCooperativeState } from '../../redux/reducers/slice/appStateSlice';
28+
import { codePreviewCooperative } from '../../redux/reducers/slice/codePreviewSlice';
29+
import { cooperativeStyle } from '../../redux/reducers/slice/styleSlice';
30+
import config from '../../../../config';
3131
const { API_BASE_URL } = config;
3232

3333
let socket;

app/src/index.js renamed to app/src/index.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,17 @@ import {
77
} from 'react-router-dom';
88
import 'babel-polyfill';
99
import React from 'react';
10-
import store from './redux/store.ts';
10+
import store from './redux/store';
1111
import { Provider } from 'react-redux';
1212
import ReactDOM from 'react-dom';
1313
import Cookies from 'js-cookie';
14-
import App from './components/App.tsx';
15-
import SignIn from './components/login/SignIn.tsx';
16-
import SignUp from './components/login/SignUp.tsx';
17-
import FBPassWord from './components/login/FBPassWord.tsx';
18-
import Tutorial from './tutorial/Tutorial.tsx';
19-
import TutorialPage from './tutorial/TutorialPage.tsx';
20-
import ProjectDashboard from './Dashboard/ProjectContainer.tsx';
14+
import App from './components/App';
15+
import SignIn from './components/login/SignIn';
16+
import SignUp from './components/login/SignUp';
17+
import FBPassWord from './components/login/FBPassWord';
18+
import Tutorial from './tutorial/Tutorial';
19+
import TutorialPage from './tutorial/TutorialPage';
20+
import ProjectDashboard from './Dashboard/ProjectContainer';
2121

2222
const client = new ApolloClient({
2323
uri: 'https://reactype-caret.herokuapp.com/graphql',

app/src/interfaces/Interfaces.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export interface ChildElement {
3434
export interface Component {
3535
id: number;
3636
name: string;
37-
style: object;
37+
style: {};
3838
attributes?: object;
3939
events: object;
4040
code: string;
@@ -73,7 +73,7 @@ export interface HTMLType {
7373
id: number;
7474
tag: string;
7575
name: string;
76-
style: object;
76+
style: any;
7777
placeHolderShort: string | JSX.Element;
7878
placeHolderLong: string;
7979
// ? == optional type part of icon, cant comment out icon and it works

app/src/reducers.js

Lines changed: 0 additions & 14 deletions
This file was deleted.

app/src/redux/HTMLTypes.js renamed to app/src/redux/HTMLTypes.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,11 @@ import HeaderIcon from '@mui/icons-material/TextFormat';
55
import ButtonIcon from '@mui/icons-material/EditAttributes';
66
import LinkIcon from '@mui/icons-material/Link';
77
import ListIcon from '@mui/icons-material/List';
8+
import {
9+
HTMLType
10+
} from '../interfaces/Interfaces';
811

9-
const HTMLTypes = [
12+
const HTMLTypes: HTMLType[] = [
1013
{
1114
id: 11,
1215
tag: 'div',

app/src/redux/reducers/rootReducer.js renamed to app/src/redux/reducers/rootReducer.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import { combineReducers } from '@reduxjs/toolkit';
22

33
// Need to import each slice which will be combined in the rootReducer
4-
import darkModeReducer from './slice/darkModeSlice.ts';
5-
import codePreviewReducer from './slice/codePreviewSlice.ts';
6-
import contextReducer from './slice/contextReducer.ts';
7-
import appStateReducer from './slice/appStateSlice.ts';
8-
import styleReducer from './slice/styleSlice.ts';
9-
import roomCodeReducer from './slice/roomCodeSlice.ts';
4+
import darkModeReducer from './slice/darkModeSlice';
5+
import codePreviewReducer from './slice/codePreviewSlice';
6+
import contextReducer from './slice/contextReducer';
7+
import appStateReducer from './slice/appStateSlice';
8+
import styleReducer from './slice/styleSlice';
9+
import roomCodeReducer from './slice/roomCodeSlice';
1010

1111
const rootReducer = combineReducers({
1212
// Add desired slices here
File renamed without changes.
Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
11
const { v4: uuidv4 } = require('uuid');
2+
// const Buffer = require('buffer');
3+
4+
5+
// const buf = Buffer.from([0x62, 0x75, 0x66, 0x66, 0x65, 0x72]);
6+
// module.exports = buf;
27

38
// Generate an arbitrary number
49
// this arbitrary number will be used in CspHtmlWebpackPlugin and HtmlWebpackPlugin configuration in webpack
5-
module.exports = function() {
10+
module.exports = function () {
611
return new Buffer.from(uuidv4()).toString('base64');
712
};

package-lock.json

Lines changed: 54 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -147,6 +147,7 @@
147147
"babel-polyfill": "^6.26.0",
148148
"bcryptjs": "^2.4.3",
149149
"body-parser": "^1.20.2",
150+
"buffer": "^6.0.3",
150151
"cookie-parser": "^1.4.6",
151152
"cors": "^2.8.5",
152153
"d3": "^7.6.1",

webpack.config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ module.exports = {
1515
// since JS can be written for both server / browser, the "target" specifies what environment webpack should write for
1616
target: 'web', // Our app can run without electron
1717
// The entry is where webpack begins assembling the dependency tree
18-
entry: ['./app/src/index.js'], // The entry point of our app; these entry points can be named and we can also have multiple if we'd like to split the webpack bundle into smaller files to improve script loading speed between multiple pages of our app
18+
entry: ['./app/src/index.tsx'], // The entry point of our app; these entry points can be named and we can also have multiple if we'd like to split the webpack bundle into smaller files to improve script loading speed between multiple pages of our app
1919
// the output is only created on npm run-prod-build
2020
output: {
2121
path: path.resolve(__dirname, 'app/dist'), // Where all the output files get dropped after webpack is done with them

webpack.development.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
33
const merge = require('webpack-merge');
44
const base = require('./webpack.config');
55
const path = require('path');
6-
const nonce = require('./app/src/utils/createNonce')();
6+
const nonce = require('./app/src/utils/createNonce.ts')();
77
const { DEV_PORT } = require('./config');
88

99
// merges webpack.config.js with development specific configs

webpack.production.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
33
const merge = require('webpack-merge');
44
const base = require('./webpack.config');
55
const path = require('path');
6-
const nonce = require('./app/src/utils/createNonce')();
6+
const nonce = require('./app/src/utils/createNonce.ts')();
77

88
// merges webpack.config.js with production specific configs
99
module.exports = merge(base, {

0 commit comments

Comments
 (0)