From e00b07737e6006f35575623ac20c53d447c6725f Mon Sep 17 00:00:00 2001
From: mguinhos <razyrabbit@gmail.com>
Date: Fri, 18 Aug 2023 02:52:13 -0300
Subject: [PATCH] =?UTF-8?q?Adiciona=20bot=C3=B5es=20de=20contato=20para=20?=
 =?UTF-8?q?o=20GitHub=20e=20LinkedIn?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/page.tsx | 33 ++++++++++++++++++++++++---------
 1 file changed, 24 insertions(+), 9 deletions(-)

diff --git a/src/app/page.tsx b/src/app/page.tsx
index 47f8261..6e45911 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,9 +1,12 @@
 "use client";
 
-import { TextField, Button, Stack, Box } from '@mui/material'
-import { useRef, useState } from 'react';
+import { TextField, Button, Stack, Box, Typography, IconButton } from '@mui/material'
+import { useRef } from 'react';
 import * as math from 'mathjs';
 
+import GitHubIcon from '@mui/icons-material/GitHub';
+import LinkedInIcon from '@mui/icons-material/LinkedIn';
+
 function CalculatorRow({ children, ...props }: any) {
   return <Stack {...props} direction="row" spacing={1} padding={0.5} style={{display: 'flex', width: '100%', height: '100%'}}>{children}</Stack>;
 }
@@ -28,7 +31,18 @@ function CalculatorBox({ children,  ...props }: any) {
   return <Box {...props} sx={{display: 'flex', flexDirection: 'column', width: '100%', height: '100%'}}>{children}</Box>;
 }
 
-function Calculator({ ...props }) {
+function Footer({ ...props }: any) {
+  return (
+    <Box {...props} padding={2} sx={{justifyItems: 'center', alignItems: 'center', textAlign: 'center'}}>
+      <Typography variant='subtitle1'>2023 - Marcel Guinhos - MIT License</Typography>
+      <Typography variant='subtitle2'>Criado com NextJS e MaterialUI</Typography>
+      <IconButton size="large" href='https://github.com/mguinhos'><GitHubIcon /></IconButton>
+      <IconButton size="large" href='https://www.linkedin.com/in/marcel-guinhos'><LinkedInIcon /></IconButton>
+    </Box>
+  );
+}
+
+function Calculator({ ...props }: any) {
   let inputRef = useRef({value: ''});
 
   return (
@@ -42,9 +56,9 @@ function Calculator({ ...props }) {
           <CalculatorButton onClick={() => inputRef.current.value = math.evaluate(inputRef.current.value)}>=</CalculatorButton>
         </CalculatorRow>
         <CalculatorRow>
-          <CalculatorInsertButton inputRef={inputRef}>7</CalculatorInsertButton>
-          <CalculatorInsertButton inputRef={inputRef}>8</CalculatorInsertButton>
-          <CalculatorInsertButton inputRef={inputRef}>9</CalculatorInsertButton>
+          <CalculatorInsertButton inputRef={inputRef}>1</CalculatorInsertButton>
+          <CalculatorInsertButton inputRef={inputRef}>2</CalculatorInsertButton>
+          <CalculatorInsertButton inputRef={inputRef}>3</CalculatorInsertButton>
           <CalculatorInsertButton inputRef={inputRef}>+</CalculatorInsertButton>
         </CalculatorRow>
         <CalculatorRow>
@@ -60,12 +74,13 @@ function Calculator({ ...props }) {
           <CalculatorInsertButton inputRef={inputRef}>/</CalculatorInsertButton>
         </CalculatorRow>
         <CalculatorRow>
-          <CalculatorButton>+/-</CalculatorButton>
+          <CalculatorButton onClick={() => inputRef.current.value = (inputRef.current.value.startsWith('-') ? '+' + inputRef.current.value.slice(1): '-' + (inputRef.current.value.startsWith('+') ? inputRef.current.value.slice(1) : inputRef.current.value))}>+/-</CalculatorButton>
           <CalculatorInsertButton inputRef={inputRef}>0</CalculatorInsertButton>
-          <CalculatorButton>.</CalculatorButton>
-          <CalculatorButton>%</CalculatorButton>
+          <CalculatorInsertButton inputRef={inputRef}>.</CalculatorInsertButton>
+          <CalculatorInsertButton inputRef={inputRef}>%</CalculatorInsertButton>
         </CalculatorRow>
       </CalculatorBox>
+      <Footer/>
     </CalculatorBox>
   );
 }