Atualização: Melhorias de performance / Correção: Margem do último el…

…emento do modal de edição de compromisso / Correção: Sufixos eram adicionados automaticamente de forma errada / outras pequenas mudanças
gepetojj · Aug 26, 2021 · 3ed4296 · 3ed4296
1 parent d0f6a40
commit 3ed4296
Show file tree

Hide file tree

Showing 22 changed files with 231 additions and 69 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
 	"name": "meetscheduler",
 	"description": "Seja lembrado de seus compromissos no Google Meet, com o MeetScheduler.",
-	"version": "1.5.6",
+	"version": "1.6.7",
 	"author": "Gepetojj",
 	"homepage": "./",
 	"main": "build/main.js",

diff --git a/public/fonts/Poppins-Medium.ttf b/public/fonts/Poppins-Medium.ttf
diff --git a/public/fonts/Poppins-Regular.ttf b/public/fonts/Poppins-Regular.ttf
diff --git a/public/fonts/Poppins-SemiBold.ttf b/public/fonts/Poppins-SemiBold.ttf
diff --git a/public/icon.ico b/public/icon.ico
diff --git a/public/index.html b/public/index.html
@@ -3,19 +3,55 @@
 	<head>
 		<meta charset="utf-8" />
 		<link rel="icon" href="%PUBLIC_URL%/icon.ico" />
+		<meta http-equiv="Cache-control" content="public" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
-		<meta name="theme-color" content="#000000" />
+		<meta name="theme-color" content="#6958C9" />
 		<meta
 			name="description"
 			content="Seja lembrado de seus compromissos no Google Meet, com o MeetScheduler."
 		/>
-		<link rel="preconnect" href="https://fonts.googleapis.com" />
-		<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+		<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
 		<link
-			href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap"
-			rel="stylesheet"
+			rel="preload"
+			as="font"
+			href="%PUBLIC_URL%/fonts/Poppins-Regular.ttf"
+			type="font/ttf"
+			crossorigin="anonymous"
 		/>
-		<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+		<link
+			rel="preload"
+			as="font"
+			href="%PUBLIC_URL%/fonts/Poppins-Medium.ttf"
+			type="font/ttf"
+			crossorigin="anonymous"
+		/>
+		<link
+			rel="preload"
+			as="font"
+			href="%PUBLIC_URL%/fonts/Poppins-SemiBold.ttf"
+			type="font/ttf"
+			crossorigin="anonymous"
+		/>
+		<style>
+			@font-face {
+				font-family: "Poppins";
+				src: url("fonts/Poppins-Regular.ttf");
+				font-weight: 400;
+				font-display: swap;
+			}
+			@font-face {
+				font-family: "Poppins";
+				src: url("fonts/Poppins-Medium.ttf");
+				font-weight: 500;
+				font-display: swap;
+			}
+			@font-face {
+				font-family: "Poppins";
+				src: url("fonts/Poppins-SemiBold.ttf");
+				font-weight: 600;
+				font-display: swap;
+			}
+		</style>
 		<title>MeetScheduler</title>
 	</head>
 	<body>

diff --git a/public/manifest.json b/public/manifest.json
@@ -1,9 +1,11 @@
 {
 	"short_name": "MeetScheduler",
 	"name": "MeetScheduler",
-	"icons": [],
+	"icons": [
+		"icon.ico"
+	],
 	"start_url": ".",
 	"display": "standalone",
-	"theme_color": "#8826af",
-	"background_color": "#0c070e"
+	"theme_color": "#6958C9",
+	"background_color": "#39375B"
 }
diff --git a/src/components/AddAppointment.tsx b/src/components/AddAppointment.tsx
@@ -105,7 +105,7 @@ export default function AddAppointmentModal() {
 	]);
 	const [selectedDay, setSelectedDay] = useState<Day | unknown>("");
 	const { enqueueSnackbar } = useSnackbar();
-	const { schedule } = useMSContext();
+	const { schedule, settings } = useMSContext();
 
 	const handleAppointmentCreation = (
 		name: string,
@@ -198,7 +198,11 @@ export default function AddAppointmentModal() {
 							/>
 							<Input
 								fullWidth
-								label="Link da atividade"
+								label={`Link da atividade ${
+									settings.linkSuffix
+										? "(sufixo ativado)"
+										: ""
+								}`}
 								variant="standard"
 								type="url"
 							/>

diff --git a/src/components/Appointment.tsx b/src/components/Appointment.tsx
@@ -1,3 +1,4 @@
+import { memo } from "react";
 import { Delete } from "@material-ui/icons";
 import styled from "styled-components";
 
@@ -76,7 +77,7 @@ const AppointmentTime = styled.span`
 	user-select: none;
 `;
 
-export default function Appointment({
+function Appointment({
 	appointment,
 	changeModalState,
 	deleteAppointment,
@@ -103,3 +104,5 @@ export default function Appointment({
 		</AppointmentArea>
 	);
 }
+
+export default memo(Appointment);
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
@@ -1,3 +1,4 @@
+import { memo } from "react";
 import styled from "styled-components";
 
 export interface IButton {
@@ -43,13 +44,7 @@ const ButtonText = styled.span<{ hasIcon: boolean }>`
 	margin-left: ${({ hasIcon }) => (hasIcon ? "0.6rem" : "0")};
 `;
 
-export default function Button({
-	type,
-	icon,
-	text,
-	fullWidth,
-	onClick,
-}: IButton) {
+function Button({ type, icon, text, fullWidth, onClick }: IButton) {
 	return (
 		<ButtonArea
 			primary={type === "primary"}
@@ -61,3 +56,5 @@ export default function Button({
 		</ButtonArea>
 	);
 }
+
+export default memo(Button);
diff --git a/src/components/EditAppointment.tsx b/src/components/EditAppointment.tsx
@@ -75,7 +75,7 @@ export default function EditAppointment({
 	const [aLink, setALink] = useState("");
 	const [aTime, setATime] = useState("");
 	const { enqueueSnackbar } = useSnackbar();
-	const { schedule } = useMSContext();
+	const { schedule, settings } = useMSContext();
 
 	useEffect(() => {
 		setAName(appointment.name);
@@ -195,7 +195,11 @@ export default function EditAppointment({
 							/>
 							<Input
 								fullWidth
-								label="Link da atividade"
+								label={`Link da atividade ${
+									settings.linkSuffix
+										? "(sufixo ativado)"
+										: ""
+								}`}
 								variant="standard"
 								type="url"
 								value={aLink}
@@ -217,17 +221,25 @@ export default function EditAppointment({
 									setATime(event.target.value);
 								}}
 							/>
-							<Input
-								fullWidth
-								label="Dia da atividade"
-								variant="standard"
-								disabled
-								value={
-									days.find((dayObj) => {
-										return dayObj.value === appointment.day;
-									}).day
-								}
-							/>
+							<div
+								style={{
+									marginBottom: "2rem",
+								}}
+							>
+								<Input
+									fullWidth
+									label="Dia da atividade"
+									variant="standard"
+									disabled
+									value={
+										days.find((dayObj) => {
+											return (
+												dayObj.value === appointment.day
+											);
+										}).day
+									}
+								/>
+							</div>
 							<Button
 								fullWidth
 								type="primary"

diff --git a/src/components/Header.tsx b/src/components/Header.tsx
@@ -70,6 +70,7 @@ export default function Header({ children }) {
 				</HeaderLeftSide>
 				<HeaderRightSide>
 					<HeaderOption
+						aria-label="Minimiza o programa"
 						onClick={() => {
 							ipcRenderer.send("minimize-program");
 						}}
@@ -82,6 +83,7 @@ export default function Header({ children }) {
 						/>
 					</HeaderOption>
 					<HeaderOption
+						aria-label="Fecha o programa"
 						isCloseOption
 						onClick={() => {
 							ipcRenderer.send("close-program");

diff --git a/src/components/Input.tsx b/src/components/Input.tsx
@@ -1,3 +1,4 @@
+import { memo } from "react";
 import { styled as MUIStyled } from "@material-ui/core/styles";
 import { StandardTextFieldProps, TextField } from "@material-ui/core";
 
@@ -40,6 +41,8 @@ const StyledInput = MUIStyled(TextField)({
 	},
 });
 
-export default function Input(options: StandardTextFieldProps) {
+function Input(options: StandardTextFieldProps) {
 	return <StyledInput {...options} />;
 }
+
+export default memo(Input);
diff --git a/src/components/LoadingContent.tsx b/src/components/LoadingContent.tsx
@@ -0,0 +1,31 @@
+import { memo } from "react";
+import CircularProgress from "@material-ui/core/CircularProgress";
+
+import { theme } from "../styles/theme";
+
+function LoadingContent() {
+	return (
+		<div
+			style={{
+				display: "flex",
+				flexDirection: "column",
+				justifyContent: "center",
+				alignItems: "center",
+				width: "100%",
+				height: "100%",
+				color: theme.colors.font.main,
+			}}
+		>
+			<h1>O MeetScheduler está carregando.</h1>
+			<h2 style={{ marginTop: "0.5rem" }}>Aguarde...</h2>
+			<CircularProgress
+				style={{
+					color: theme.colors.font.mOne,
+					marginTop: "2rem",
+				}}
+			/>
+		</div>
+	);
+}
+
+export default memo(LoadingContent);
diff --git a/src/components/MSContext.tsx b/src/components/MSContext.tsx
@@ -11,6 +11,13 @@ export type Setting =
 	| "autoOpenAppointments"
 	| "linkSuffix";
 
+export const SETTINGS: Setting[] = [
+	"firstTimeAccess",
+	"useMondayAsFirstDay",
+	"autoOpenAppointments",
+	"linkSuffix",
+];
+
 export interface Settings {
 	firstTimeAccess: boolean;
 	useMondayAsFirstDay: boolean;

diff --git a/src/components/NoAppointment.tsx b/src/components/NoAppointment.tsx
@@ -1,3 +1,4 @@
+import { memo } from "react";
 import { RiGhostLine } from "react-icons/ri";
 import styled from "styled-components";
 
@@ -24,11 +25,13 @@ const AppointmentLabel = styled.span`
 	user-select: none;
 `;
 
-export default function NoAppointment() {
+function NoAppointment() {
 	return (
 		<AppointmentArea>
 			<RiGhostLine color={theme.colors.font.mOne} size={40} />
 			<AppointmentLabel>Sem atividades</AppointmentLabel>
 		</AppointmentArea>
 	);
 }
+
+export default memo(NoAppointment);
diff --git a/src/components/Options.tsx b/src/components/Options.tsx
@@ -122,16 +122,23 @@ const Setting = styled.div`
 const StyledSwitch = MUIStyled(Switch)({
 	"& .MuiSwitch-switchBase": {
 		color: theme.colors.secondary.mTwo,
+		transition: "0.2s",
 	},
 	"& .MuiSwitch-track": {
 		backgroundColor: theme.colors.secondary.mTwo,
 	},
+	"& .MuiIconButton-root:hover": {
+		backgroundColor: theme.colors.secondary.mTwo + "25",
+	},
 	"& .MuiSwitch-colorSecondary.Mui-checked": {
 		color: theme.colors.primary.main,
 	},
 	"& .MuiSwitch-colorSecondary.Mui-checked + .MuiSwitch-track": {
 		backgroundColor: theme.colors.secondary.mTwo,
 	},
+	"& .MuiSwitch-colorSecondary.Mui-checked:hover": {
+		backgroundColor: theme.colors.primary.main + "25",
+	},
 });
 
 const StyledDivider = MUIStyled(Divider)({
@@ -223,7 +230,7 @@ export default function Options() {
 							</Setting>
 							<StyledDivider />
 							<Setting>
-								<p>Sufixo automático para links.</p>
+								<p>Sufixo automático nos links.</p>
 								<Input
 									label="Sufixo"
 									variant="standard"
@@ -242,6 +249,7 @@ export default function Options() {
 				)}
 			</SettingsModal>
 			<OptionsButton
+				aria-label="Abre as opções"
 				aria-controls="menu"
 				aria-haspopup="true"
 				onClick={enableMenu}

diff --git a/src/components/Schedule.tsx b/src/components/Schedule.tsx
@@ -1,3 +1,4 @@
+import { memo } from "react";
 import {
 	DragDropContext,
 	Droppable,
@@ -63,7 +64,7 @@ const DayName = styled.h2<{ marked: boolean }>`
 	text-decoration: ${(props) => (props.marked ? "underline" : "none")};
 `;
 
-export default function Schedule({ day, deleteAppointment }: ISchedule) {
+function Schedule({ day, deleteAppointment }: ISchedule) {
 	const { schedule, settings } = useMSContext();
 
 	const reorder = (day: Day, startIndex: number, endIndex: number) => {
@@ -209,3 +210,5 @@ export default function Schedule({ day, deleteAppointment }: ISchedule) {
 		</ScheduleArea>
 	);
 }
+
+export default memo(Schedule);