Validacion basica del formulario de login

app/src/components/pages/Login.tsx

@@ -1,6 +1,7 @@
 import React, {
   ChangeEvent,
   useContext,
+  useMemo,
   FormEventHandler,
   useState,
 } from "react";
@@ -18,6 +19,17 @@ const Login = () => {
   const dispatch = useContext(UserDispatchContext);
   const userState = useContext(UserStateContext);
 
+  // Medio chota la validacion quizas despues usemos una alternativa mejor
+  const isValid = useMemo<Boolean>(() => {
+    let valid = true;
+    valid = valid && Object.keys(formState).length >= 2;
+    for (let key in formState) {
+      valid = valid && formState[key] && formState != "";
+    }
+
+    return valid;
+  }, [formState]);
+
   const handleFormChange = (e: ChangeEvent) => {
     const el = e.target as HTMLInputElement;
     const name = el.getAttribute("name") as string;
@@ -82,7 +94,11 @@ const Login = () => {
           name="password"
           placeholder="Contraseña"
         />
-        <button className="btn btn-primary" type="submit">
+        <button
+          className={`btn btn-primary ${!isValid && "disabled"}`}
+          disabled={!isValid}
+          type="submit"
+        >
           Continuar
         </button>
       </form>

app/src/context/dashboard/Provider.tsx

@@ -30,7 +30,14 @@ function asyncDispatchWrap(dispatch: Dispatch<Action>) {
   return asyncDispatch;
 }
 
-export const StateContext = createContext<State>({});
+// Este no es el estado default!
+// createContext necesita un valor default pero los providers siempre van a tener una prop 'value'
+export const StateContext = createContext<State>({
+  sector: null,
+  year: "",
+  from: "",
+  to: "",
+});
 export const DispatchContext = createContext<
   (action: Action | ((...args: any) => Promise<any>)) => void
 >(asyncDispatchWrap((dispatch) => {}));