Aspnet/AlquilaFacil.csproj

@@ -7,7 +7,10 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="htmx" Version="1.8.0" />
+    <PackageReference Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="8.0.8" />
+    <PackageReference Include="Microsoft.AspNetCore.OpenApi" Version="8.0.7" />
+    <PackageReference Include="Swashbuckle.AspNetCore" Version="6.8.1" />
+    <PackageReference Include="System.IdentityModel.Tokens.Jwt" Version="8.0.2" />
   </ItemGroup>
 
   <ItemGroup>

Aspnet/Controllers/InquilinoController.cs

@@ -27,7 +27,8 @@ public class InquilinoController: Controller
         if (inq.Dni < 0 ) return BadRequest("Dni Invalido");
 
     
-        return Redirect("/Inquilino");
+// no recuerdo porque esto existe
+//      return Redirect("/Inquilino");
         return Content($"<p>Inquilino {inq.Nombre} agregado exitosamente.</p>", "text/html");
     }
 
@@ -38,4 +39,4 @@ public class InquilinoController: Controller
     public IActionResult FormAdd(){
         return View();
     }
-}
+}

Aspnet/Controllers/LoginController.cs

@@ -1,30 +1,41 @@
+using Entidades.Dto;
+using Modelo;
+using Microsoft.AspNetCore.Mvc;
+using System.IdentityModel.Tokens.Jwt;
+using System.Security.Claims;
+using System.Text;
+using Microsoft.IdentityModel.Tokens;
+namespace AlquilaFacil.Controllers;
 
-    using Entidades.Dto;
-    using Modelo;
-    using Microsoft.AspNetCore.Mvc;
-    namespace AlquilaFacil.Controllers;
+[ApiController]
+public class LoginController: ControllerBase
+{
+    [HttpPost("api/login")]
+    public IActionResult Login([FromBody] LoginDto loginDto) { 
+            
+        if (loginDto.Email == String.Empty || loginDto.Contraseña == String.Empty) return Unauthorized(new {message = "Los Datos no llegaron correctamente o faltan"}); 
+         
+        var usuario = RepositorioUsuarios.Singleton.CheckUsuario(loginDto);
+        if (usuario == null) return Unauthorized(new {message = "El usuario no existe o la contraseña es incorrecta"}); 
 
-    public class LoginController: Controller
-    {
-        public IActionResult Index(){
-            return View();
-        }
+        string tokenString = GenerarToken(loginDto);
+        return Ok( new {Token = tokenString, Redirect = "/Menu"});  
+    }
 
-        [HttpPost("api/login")]
-        public IActionResult Login([FromForm] LoginDto loginDto) { 
-
-            var usuario = RepositorioUsuarios.Singleton.CheckUsuario(loginDto);
-            if (usuario == null){
-                return Content(errorAlert); 
-            }
-            else {
-                Response.Headers["HX-Redirect"] = "/Home";
-                return Ok();  
-            }
-        }
-
-        private const string errorAlert = @"
-                <div class='alert alert-warning alert-dismissible fade show' role='alert'>
-                    <strong>Error!</strong> Usuario o contraseña incorrectos.
-                </div>";
-    }   
+       
+    private string GenerarToken(LoginDto loginDto){
+        var tokenHandler = new JwtSecurityTokenHandler();
+        var key = Encoding.ASCII.GetBytes("ffb2cdc15d472e41a5b626e294c45020"); 
+        var tokenDescriptor = new SecurityTokenDescriptor
+        {
+            Subject = new ClaimsIdentity(new Claim[]
+            {
+                new Claim(ClaimTypes.Name, loginDto.Email)
+            }),
+            Expires = DateTime.UtcNow.AddHours(1),
+            SigningCredentials = new SigningCredentials(new SymmetricSecurityKey(key), SecurityAlgorithms.HmacSha256Signature)
+        };
+        var token = tokenHandler.CreateToken(tokenDescriptor);
+        return tokenHandler.WriteToken(token);
+    }
+}

Aspnet/Program.cs

@@ -1,30 +1,41 @@
+
 var builder = WebApplication.CreateBuilder(args);
 
 // Add services to the container.
 builder.Services.AddControllers();
-builder.Services.AddControllersWithViews();
+builder.Services.AddEndpointsApiExplorer();
+builder.Services.AddSwaggerGen();
+
+builder.Services.AddCors(options =>
+    {
+        options.AddPolicy("AllowSvelteApp",
+            builder =>
+            {
+                builder.WithOrigins("*")
+                       .AllowAnyHeader()
+                       .AllowAnyMethod();
+            });
+    });
 
 var app = builder.Build();
 
 // Configure the HTTP request pipeline.
-if (!app.Environment.IsDevelopment())
+if (app.Environment.IsDevelopment())
 {
-    app.UseExceptionHandler("/Home/Error");
-    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
-    app.UseHsts();
+    app.UseSwagger();
+    app.UseSwaggerUI();
 }
 
-app.UseHttpsRedirection();
-app.UseStaticFiles();
-
 app.UseRouting();
 
+app.UseAuthentication();
 app.UseAuthorization();
 
 app.MapControllerRoute(
     name: "default",
     pattern: "{controller=Login}/{action=Index}/{id?}");
 
+app.UseCors("AllowSvelteApp");
 app.UseEndpoints(endpoints =>
 {
     // Mapea los controladores a las rutas predeterminadas.

Aspnet/Views/Login/ErrorPopup.cshtml

@@ -1,5 +1,5 @@
 @model Entidades.Dto.LoginDto;
 
 <div class="alert alert-danger" role="alert">
-  "@Model.Usuario"
+  "@Model"
 </div>

Entidades/Dto/LoginDto.cs

@@ -5,6 +5,6 @@ namespace Entidades.Dto;
 [NotMapped]
 public class LoginDto
 {
-    public string Usuario {get; set;} = string.Empty;
-    public string Contrasena {get; set;} = string.Empty;
-}
+    public string Email {get; set;} = string.Empty;
+    public string Contraseña {get; set;} = string.Empty;
+}

Entidades/Dto/TokenDto.cs

@@ -0,0 +1,6 @@
+namespace Entidades.Dto;
+
+public class TokenDto{
+	public string Token {get; set;} = String.Empty;
+	public string Redirect { get; set; } = String.Empty;
+}

Front/.gitignore

@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

Front/.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["svelte.svelte-vscode"]
+}

Front/README.md

@@ -0,0 +1,47 @@
+# Svelte + TS + Vite
+
+This template should help get you started developing with Svelte and TypeScript in Vite.
+
+## Recommended IDE Setup
+
+[VS Code](https://code.visualstudio.com/) + [Svelte](https://marketplace.visualstudio.com/items?itemName=svelte.svelte-vscode).
+
+## Need an official Svelte framework?
+
+Check out [SvelteKit](https://github.com/sveltejs/kit#readme), which is also powered by Vite. Deploy anywhere with its serverless-first approach and adapt to various platforms, with out of the box support for TypeScript, SCSS, and Less, and easily-added support for mdsvex, GraphQL, PostCSS, Tailwind CSS, and more.
+
+## Technical considerations
+
+**Why use this over SvelteKit?**
+
+- It brings its own routing solution which might not be preferable for some users.
+- It is first and foremost a framework that just happens to use Vite under the hood, not a Vite app.
+
+This template contains as little as possible to get started with Vite + TypeScript + Svelte, while taking into account the developer experience with regards to HMR and intellisense. It demonstrates capabilities on par with the other `create-vite` templates and is a good starting point for beginners dipping their toes into a Vite + Svelte project.
+
+Should you later need the extended capabilities and extensibility provided by SvelteKit, the template has been structured similarly to SvelteKit so that it is easy to migrate.
+
+**Why `global.d.ts` instead of `compilerOptions.types` inside `jsconfig.json` or `tsconfig.json`?**
+
+Setting `compilerOptions.types` shuts out all other types not explicitly listed in the configuration. Using triple-slash references keeps the default TypeScript setting of accepting type information from the entire workspace, while also adding `svelte` and `vite/client` type information.
+
+**Why include `.vscode/extensions.json`?**
+
+Other templates indirectly recommend extensions via the README, but this file allows VS Code to prompt the user to install the recommended extension upon opening the project.
+
+**Why enable `allowJs` in the TS template?**
+
+While `allowJs: false` would indeed prevent the use of `.js` files in the project, it does not prevent the use of JavaScript syntax in `.svelte` files. In addition, it would force `checkJs: false`, bringing the worst of both worlds: not being able to guarantee the entire codebase is TypeScript, and also having worse typechecking for the existing JavaScript. In addition, there are valid use cases in which a mixed codebase may be relevant.
+
+**Why is HMR not preserving my local component state?**
+
+HMR state preservation comes with a number of gotchas! It has been disabled by default in both `svelte-hmr` and `@sveltejs/vite-plugin-svelte` due to its often surprising behavior. You can read the details [here](https://github.com/rixo/svelte-hmr#svelte-hmr).
+
+If you have state that's important to retain within a component, consider creating an external store which would not be replaced by HMR.
+
+```ts
+// store.ts
+// An extremely simple external store
+import { writable } from 'svelte/store'
+export default writable(0)
+```

Front/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/png" href="/favicon.png" />
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>AlquilaFacil</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

Front/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "front",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "check": "svelte-check --tsconfig ./tsconfig.json && tsc -p tsconfig.node.json"
+  },
+  "devDependencies": {
+    "@sveltejs/vite-plugin-svelte": "^3.1.2",
+    "@tsconfig/svelte": "^5.0.4",
+    "svelte": "^4.2.19",
+    "svelte-check": "^4.0.4",
+    "tslib": "^2.7.0",
+    "typescript": "^5.5.3",
+    "vite": "^5.4.8"
+  },
+  "dependencies": {
+    "@sveltejs/kit": "^2.7.1",
+    "@sveltestrap/sveltestrap": "^6.2.7",
+    "svelte-routing": "^2.13.0"
+  }
+}

Front/src/App.svelte

@@ -0,0 +1,11 @@
+<script lang="ts">
+  import Login from "./login/loginPage.svelte";
+  import { Router, Route, link } from 'svelte-routing';
+  import MenuPage from './Menu/page.svelte';
+</script>
+
+<Router>
+  <Route path="/Menu" component={MenuPage} />
+  <Route path="/" component={Login} />
+</Router>
+

Front/src/Menu/page.svelte

@@ -0,0 +1 @@
+

Front/src/app.css

@@ -0,0 +1,79 @@
+:root {
+  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+.card {
+  padding: 2em;
+}
+
+#app {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}

Front/src/assets/svelte.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="26.6" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 308"><path fill="#FF3E00" d="M239.682 40.707C211.113-.182 154.69-12.301 113.895 13.69L42.247 59.356a82.198 82.198 0 0 0-37.135 55.056a86.566 86.566 0 0 0 8.536 55.576a82.425 82.425 0 0 0-12.296 30.719a87.596 87.596 0 0 0 14.964 66.244c28.574 40.893 84.997 53.007 125.787 27.016l71.648-45.664a82.182 82.182 0 0 0 37.135-55.057a86.601 86.601 0 0 0-8.53-55.577a82.409 82.409 0 0 0 12.29-30.718a87.573 87.573 0 0 0-14.963-66.244"></path><path fill="#FFF" d="M106.889 270.841c-23.102 6.007-47.497-3.036-61.103-22.648a52.685 52.685 0 0 1-9.003-39.85a49.978 49.978 0 0 1 1.713-6.693l1.35-4.115l3.671 2.697a92.447 92.447 0 0 0 28.036 14.007l2.663.808l-.245 2.659a16.067 16.067 0 0 0 2.89 10.656a17.143 17.143 0 0 0 18.397 6.828a15.786 15.786 0 0 0 4.403-1.935l71.67-45.672a14.922 14.922 0 0 0 6.734-9.977a15.923 15.923 0 0 0-2.713-12.011a17.156 17.156 0 0 0-18.404-6.832a15.78 15.78 0 0 0-4.396 1.933l-27.35 17.434a52.298 52.298 0 0 1-14.553 6.391c-23.101 6.007-47.497-3.036-61.101-22.649a52.681 52.681 0 0 1-9.004-39.849a49.428 49.428 0 0 1 22.34-33.114l71.664-45.677a52.218 52.218 0 0 1 14.563-6.398c23.101-6.007 47.497 3.036 61.101 22.648a52.685 52.685 0 0 1 9.004 39.85a50.559 50.559 0 0 1-1.713 6.692l-1.35 4.116l-3.67-2.693a92.373 92.373 0 0 0-28.037-14.013l-2.664-.809l.246-2.658a16.099 16.099 0 0 0-2.89-10.656a17.143 17.143 0 0 0-18.398-6.828a15.786 15.786 0 0 0-4.402 1.935l-71.67 45.674a14.898 14.898 0 0 0-6.73 9.975a15.9 15.9 0 0 0 2.709 12.012a17.156 17.156 0 0 0 18.404 6.832a15.841 15.841 0 0 0 4.402-1.935l27.345-17.427a52.147 52.147 0 0 1 14.552-6.397c23.101-6.006 47.497 3.037 61.102 22.65a52.681 52.681 0 0 1 9.003 39.848a49.453 49.453 0 0 1-22.34 33.12l-71.664 45.673a52.218 52.218 0 0 1-14.563 6.398"></path></svg>

Front/src/lib/Counter.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  let count: number = 0
+  const increment = () => {
+    count += 1
+  }
+</script>
+
+<button on:click={increment}>
+  count is {count}
+</button>

Front/src/lib/NavBarLogin.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+    import { Navbar } from "@sveltestrap/sveltestrap";
+</script>
+
+
+<Navbar container="xxl" color="dark-subtle">
+  AlquilaFacil
+</Navbar>

Front/src/lib/login.svelte

@@ -0,0 +1,66 @@
+<script>
+  import { CardHeader, CardTitle, Button, Card, Input, Form, CardBody, FormGroup } from '@sveltestrap/sveltestrap';
+  import { navigate } from 'svelte-routing';
+  
+  let email = ""
+  let contraseña = ""
+  let errorMessage = ""
+  let showAlert = false; // Controla la visibilidad del alert
+  
+  async function submitForm(event) {
+    event.preventDefault();
+    
+    const data = {email, contraseña};
+    try{
+      const response = await fetch("http://127.0.0.1:5007/api/login",{ 
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(data)
+      });
+
+      if (!response.ok){
+       const errorData = await response.json()
+       errorMessage = errorData.message;
+       showAlert = true;
+       return;
+      }
+
+      const ret = await response.json();
+      localStorage.clear();
+      localStorage.setItem('token', ret.token);
+      navigate(ret.redirect);
+    } catch (e) {
+    }
+   
+  }
+function closeAlert() {
+  showAlert = false; // Oculta el alert
+}  
+</script>
+
+<Card class="position-sticky top-50 start-50 translate-middle-x" style="width: 18rem; height: auto;" theme="auto" color="dark" outline>
+  <CardHeader>
+    <CardTitle>Iniciar Sesión</CardTitle>
+  </CardHeader>
+  <CardBody>
+    <Form on:submit={submitForm}>
+      <FormGroup floating label="Email">
+        <Input type="email" placeholder="ejemplo@mail.com" bind:value={email}/>
+      </FormGroup>
+      <FormGroup floating label="Contraseña">
+        <Input type="password" placeholder="*********" bind:value={contraseña}/>
+      </FormGroup>     
+      <FormGroup>
+        <Button color="primary" type="submit">Ingresar</Button>
+      </FormGroup>     
+    </Form>
+{#if errorMessage}
+    <div class='alert alert-warning alert-dismissible fade show' role='alert'>
+      <strong>{errorMessage}</strong> 
+      <button type="button" class="btn-close" aria-label="Close" on:click={closeAlert}></button>
+    </div>
+{/if}
+  </CardBody>
+</Card>

Front/src/login/loginPage.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import Login from "../lib/login.svelte"
+  import Navbar from "../lib/NavBarLogin.svelte";
+</script>
+
+<Navbar/>
+<div class="position-relative">
+  <br>
+  <Login/>
+</div>

Front/src/main.ts

@@ -0,0 +1,8 @@
+//import './app.css'
+import App from './App.svelte'
+
+const app = new App({
+  target: document.getElementById('app')!,
+})
+
+export default app

Front/src/vite-env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="svelte" />
+/// <reference types="vite/client" />

Front/svelte.config.js

@@ -0,0 +1,7 @@
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
+
+export default {
+  // Consult https://svelte.dev/docs#compile-time-svelte-preprocess
+  // for more information about preprocessors
+  preprocess: vitePreprocess(),
+}

Front/tsconfig.json

@@ -0,0 +1,21 @@
+{
+  "extends": "@tsconfig/svelte/tsconfig.json",
+  "compilerOptions": {
+    "target": "ESNext",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "resolveJsonModule": true,
+    /**
+     * Typecheck JS in `.svelte` and `.js` files by default.
+     * Disable checkJs if you'd like to use dynamic types in JS.
+     * Note that setting allowJs false does not prevent the use
+     * of JS in `.svelte` files.
+     */
+    "allowJs": true,
+    "checkJs": true,
+    "isolatedModules": true,
+    "moduleDetection": "force"
+  },
+  "include": ["src/**/*.ts", "src/**/*.js", "src/**/*.svelte"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}

Front/tsconfig.node.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "strict": true,
+    "noEmit": true
+  },
+  "include": ["vite.config.ts"]
+}

Front/vite.config.ts

@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import { svelte } from '@sveltejs/vite-plugin-svelte'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [svelte()],
+})

Modelo/RepositorioUsuarios.cs

@@ -1,9 +1,7 @@
 using System.Collections.ObjectModel;
-using System.Runtime.Intrinsics.Arm;
 using System.Security.Cryptography;
 using System.Text;
 using Entidades.Dto;
-using Microsoft.Data.SqlClient;
 using Microsoft.EntityFrameworkCore;
 namespace Modelo;
 
@@ -12,15 +10,15 @@ public class RepositorioUsuarios: RepositorioBase<Usuario>
     public static RepositorioUsuarios Singleton = new();
     public Usuario? CheckUsuario(LoginDto logindto) {
 
-        byte[] Contraseña = HacerHash(logindto.Contrasena);
+        byte[] Contraseña = HacerHash(logindto.Contraseña);
 
-        bool usu = Context.Inquilinos.Any(x=>x.Email == logindto.Usuario && x.Contrasena == Contraseña);
+        bool usu = Context.Inquilinos.Any(x=>x.Email == logindto.Email && x.Contrasena == Contraseña);
         if (usu){
-            return Context.Inquilinos.FirstOrDefault(x=>x.Email == logindto.Usuario);
+            return Context.Inquilinos.FirstOrDefault(x=>x.Email == logindto.Email);
         }
-        usu = Context.Propietarios.Any(x=>x.Email == logindto.Usuario && x.Contrasena == Contraseña);
+        usu = Context.Propietarios.Any(x=>x.Email == logindto.Email && x.Contrasena == Contraseña);
         if (usu){
-            return Context.Propietarios.FirstOrDefault(x=>x.Email == logindto.Usuario);
+            return Context.Propietarios.FirstOrDefault(x=>x.Email == logindto.Email);
         }
         return null;
     }
@@ -34,4 +32,4 @@ public class RepositorioUsuarios: RepositorioBase<Usuario>
         return Encoding.UTF8.GetBytes(BitConverter.ToString(buf).Replace("-","").ToLower());
     }
 
-}
+}