From c8a87763a2b221314c04906945de18c150fdc07b Mon Sep 17 00:00:00 2001
From: Sudarshan Sreeram <sudarshan.sreeram19@imperial.ac.uk>
Date: Tue, 25 Aug 2020 17:43:23 +0530
Subject: [PATCH] Format app files in the components folder
---
src/components/App.scss | 23 +++++++-------
src/components/App.test.tsx | 8 ++---
src/components/App.tsx | 63 +++++++++++++++++++------------------
3 files changed, 48 insertions(+), 46 deletions(-)
diff --git a/src/components/App.scss b/src/components/App.scss
index bdb3a88b8..d9ae29716 100644
--- a/src/components/App.scss
+++ b/src/components/App.scss
@@ -5,9 +5,9 @@ body {
margin: 0;
font-family: "IBM Plex Sans", sans-serif !important;
-webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- -webkit-overflow-scrolling: touch;
- overflow-y: scroll;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-overflow-scrolling: touch;
+ overflow-y: scroll;
}
code {
@@ -15,14 +15,15 @@ code {
monospace;
}
-.btn-primary.focus, .btn-primary:focus {
- color: #000;
- background-color: #f8f9fa;
- border-color: #0062cc;
- box-shadow: none;
+.btn-primary.focus,
+.btn-primary:focus {
+ color: #000;
+ background-color: #f8f9fa;
+ border-color: #0062cc;
+ box-shadow: none;
}
-.btn-primary{
+.btn-primary {
margin-bottom: 0.625rem;
color: #000;
background: #f6f8fa;
@@ -59,6 +60,6 @@ code {
color: #000;
}
-.modal-backdrop{
- z-index: 9000;
+.modal-backdrop {
+ z-index: 9000;
}
diff --git a/src/components/App.test.tsx b/src/components/App.test.tsx
index 4db7ebc25..352d7b8ff 100644
--- a/src/components/App.test.tsx
+++ b/src/components/App.test.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import App from './App';
+import React from "react";
+import { render } from "@testing-library/react";
+import App from "./App";
-test('renders learn react link', () => {
+test("renders learn react link", () => {
const { getByText } = render(<App />);
const linkElement = getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
diff --git a/src/components/App.tsx b/src/components/App.tsx
index 0e0acc935..53508972d 100644
--- a/src/components/App.tsx
+++ b/src/components/App.tsx
@@ -6,7 +6,7 @@ import {
faBookOpen,
faHome,
faCalendarWeek,
- faChalkboardTeacher,
+ faChalkboardTeacher
} from "@fortawesome/free-solid-svg-icons";
import StandardView from "./pages/StandardView";
import { Switch, Route } from "react-router-dom";
@@ -16,8 +16,8 @@ import SettingsModal from "./pages/SettingsModal";
type AppState = {
toggledLeft: boolean;
toggledRight: boolean;
- showSettings: boolean;
- fileView: string;
+ showSettings: boolean;
+ fileView: string;
};
class App extends React.Component<{}, AppState> {
@@ -27,14 +27,15 @@ class App extends React.Component<{}, AppState> {
this.state = {
toggledLeft: false,
toggledRight: false,
- showSettings: false,
- fileView: localStorage.getItem("fileView") || "card",
+ showSettings: false,
+ fileView: localStorage.getItem("fileView") || "card"
};
}
componentDidMount() {
- document.documentElement.style.fontSize = `${localStorage.getItem("interfaceSize") || "100"}%`;
-
+ document.documentElement.style.fontSize = `${localStorage.getItem(
+ "interfaceSize"
+ ) || "100"}%`;
window.addEventListener("resize", () => {
if (window.innerWidth !== this.width) {
@@ -48,22 +49,22 @@ class App extends React.Component<{}, AppState> {
toggleLeftBar() {
if (window.innerWidth <= 1024) {
this.setState({
- toggledRight: false,
+ toggledRight: false
});
}
- this.setState((state) => ({
- toggledLeft: !state.toggledLeft,
+ this.setState(state => ({
+ toggledLeft: !state.toggledLeft
}));
}
toggleRightBar() {
if (window.innerWidth <= 1024) {
this.setState({
- toggledLeft: false,
+ toggledLeft: false
});
}
- this.setState((state) => ({
- toggledRight: !state.toggledRight,
+ this.setState(state => ({
+ toggledRight: !state.toggledRight
}));
}
@@ -71,37 +72,37 @@ class App extends React.Component<{}, AppState> {
if (window.innerWidth <= 1024) {
this.setState({
toggledLeft: false,
- toggledRight: false,
+ toggledRight: false
});
} else {
this.setState({
toggledLeft: true,
- toggledRight: true,
+ toggledRight: true
});
}
- }
-
- setFileView(view: string){
- this.setState({fileView: view});
- localStorage.setItem("fileView", view);
- }
+ }
+
+ setFileView(view: string) {
+ this.setState({ fileView: view });
+ localStorage.setItem("fileView", view);
+ }
render() {
const horizontalBarPages = [
{ name: "Dashboard", path: "/dashboard", icon: faHome },
{ name: "Modules", path: "/modules", icon: faChalkboardTeacher },
{ name: "Timeline", path: "/timeline", icon: faCalendarWeek },
- { name: "Exams", path: "/exams", icon: faBookOpen },
+ { name: "Exams", path: "/exams", icon: faBookOpen }
];
return (
<>
<SettingsModal
show={this.state.showSettings}
- onHide={() => this.setState({ showSettings: false })}
- fileView={this.state.fileView}
- onCardViewClick={() => this.setFileView("card")}
- onListViewClick={() => this.setFileView("list")}
+ onHide={() => this.setState({ showSettings: false })}
+ fileView={this.state.fileView}
+ onCardViewClick={() => this.setFileView("card")}
+ onListViewClick={() => this.setFileView("list")}
/>
<Switch>
@@ -112,11 +113,11 @@ class App extends React.Component<{}, AppState> {
<Route path="/">
<TopBar
pages={horizontalBarPages}
- onFavIconClick={(e) => {
+ onFavIconClick={e => {
e.preventDefault();
this.toggleLeftBar();
}}
- onUserIconClick={(e) => {
+ onUserIconClick={e => {
e.preventDefault();
this.toggleRightBar();
}}
@@ -126,11 +127,11 @@ class App extends React.Component<{}, AppState> {
onSettingsClick={() => this.setState({ showSettings: true })}
toggledLeft={this.state.toggledLeft}
toggledRight={this.state.toggledRight}
- onOverlayClick={(e) => {
+ onOverlayClick={e => {
e.preventDefault();
this.setState({ toggledLeft: false, toggledRight: false });
- }}
- fileView={this.state.fileView}
+ }}
+ fileView={this.state.fileView}
/>
<BottomBar pages={horizontalBarPages} />
--
GitLab