feat: ✨ Sessions controller

Sessions helper methods, login and signup modals, load partial views with stimulus

Situmuls usersController, Create and Destroy user sessions

app/javascript/controllers/links_controller.js

@@ -1,18 +1,23 @@
 import { Controller } from "stimulus"
 
 export default class extends Controller {
-  static targets = ["url", "output"]
+  static targets = ["url", "output", "userLinks"]
 
-  onSuccess(event) {
-    const [, , xhr] = event.detail
-    this.outputTarget.innerHTML = xhr.response
+  initialize() {
+    this.loggedIn = Boolean(document.querySelector('meta[name="logged-in"]').getAttribute('content') === 'true')
   }
 
-  onError(event) {
+  onCreateLinkSuccess(event) {
+    const [, , xhr] = event.detail
+    this.outputTarget.innerHTML = xhr.response
+    if (this.loggedIn && !this.userLinksTarget.innerHTML.includes(xhr.response)) {
+      this.userLinksTarget.innerHTML = xhr.response + this.userLinksTarget.innerHTML
+    }
+  }
+
+  onCreateLinkError(event) {
     const [data, ,] = event.detail
-
     const urlError = `Url: ${data.url.join(' ')}`
-
     alert(urlError)
   }
 }

app/javascript/controllers/users_controller.js

@@ -1,9 +1,35 @@
 import { Controller } from "stimulus"
 
 export default class extends Controller {
+  static targets = ["signupModal", "loginModal"]
+
+  openLoginModal() {
+    this.loginModalTarget.classList.remove("hidden")
+  }
+
+  closeLoginModal() {
+    this.loginModalTarget.classList.add("hidden")
+  }
+
+  openSignupModal() {
+    this.signupModalTarget.classList.remove("hidden") 
+  }
+
+  closeSignupModal() {
+    this.signupModalTarget.classList.add("hidden") 
+  }
+
+  onSignupSuccess() {
+    this.closeSignupModal();
+  }
+
+  onLoginSuccess() {
+    this.closeLoginModal();
+  }
+
   onError(event) {
     const [data, ,] = event.detail
-    
+
     const usernameError = `Username: ${data.username.join(' ')}`
     const passwordError = `Password: ${data.username.join(' ')}`
 

app/javascript/stylesheets/base.css

@@ -1,3 +1,4 @@
 a {
+	cursor: pointer;
 	text-decoration: underline;
 }