~ createdb ice_cream_db_2

runtime 'org.postgresql:postgresql:9.4.1212'

dataSource:
    dbCreate: create-drop
    driverClassName: org.postgresql.Driver
    dialect: org.hibernate.dialect.PostgreSQLDialect
    username: postgres
    password:
    url: jdbc:postgresql://localhost:5432/ice_cream_db_2

create table ice_creams (
  id serial primary key,
  flavor text
);

create table users (
  username text primary key,
  password text -- encrypted length
);

create table user_ice_creams (
  username text references users(username),
  ice_cream_id integer references ice_creams(id)
);

~ ./grailsw create-domain-class demo.IceCream
~ ./grailsw create-domain-class demo.User
~ ./grailsw create-domain-class demo.UserIceCream

package demo

class User implements Serializable {
    String username
    String password

    static mapping = {
        table 'users'
        password type: 'text'
        id name: 'username', generator: 'assigned'
        version false
    }
}

package demo

class IceCream implements Serializable {
    String flavor

    static mapping = {
        table 'ice_creams'
        flavor type: 'text'
        version false
    }
}

package demo

class UserIceCream implements Serializable {
    User user
    IceCream iceCream

    static mapping = {
        table 'user_ice_creams'
        id composite: ['user', 'iceCream']
        user column: 'username'
        iceCream column: 'ice_cream_id'
        version false
    }
}

~ ./grailsw console

import demo.*

// Delete all rows from these tables:
// user and ice_cream via HQL updates (efficient for batch operations)
IceCream.executeUpdate("delete from IceCream")
User.executeUpdate("delete from User")

// Insert three new rows corresponding to three flavors.
def iceCreams = ['vanilla', 'chocolate', 'strawberry'].collect { flavor ->
    new IceCream(flavor: flavor).save(flush: true)
}

// Get an array of the ids of the new rows.
def ids = iceCreams*.id
println "Inserted records with ids ${ids.join(',')}"

// Delete the first row (vanilla)
def vanilla = IceCream.get(ids[0])
vanilla.delete()

// Change the flavor of the second row (chocolate) to "chocolate chip".
def chocolate = IceCream.findByFlavor('chocolate')
chocolate.flavor = 'chocolate chip'
chocolate.save(flush: true)

// Get all the rows in the table.
iceCreams = IceCream.list()

// Output their ids and flavors.
iceCreams.each { iceCream ->
    println "${iceCream.id}: ${iceCream.flavor}"
}

package demo

import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j

@Slf4j
@CompileStatic
class BootStrap {

    UserService userService
    UserRoleService userRoleService
    RoleService roleService
    IceCreamService iceCreamService

    def init = { servletContext ->
        log.info "Loading database..."

        if (!iceCreamService.count()) {

            List<Long> ids = []
            for (String flavor : ['vanilla', 'chocolate', 'strawberry']) {
                IceCream iceCream = iceCreamService.saveIcream(flavor)
                ids << iceCream.id
            }
            log.info "Inserted records with ids ${ids.join(',')}"
        }

        if (!roleService.count()) {
            Role role = roleService.saveRole( 'ROLE_USER')
            log.info "Inserted role..."

            User user = userService.createUser('sherlock', 'secret')
            log.info "Inserted user..."

            userRoleService.saveUserRole(user, role)
            log.info "Associated user with role..."
        }
    }
    def destroy = {
    }
}

package demo

import grails.compiler.GrailsCompileStatic
import grails.gorm.DetachedCriteria
import grails.gorm.transactions.ReadOnly
import grails.gorm.transactions.Transactional
import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j
import org.springframework.validation.ObjectError

@Slf4j
@CompileStatic
@Transactional
class IceCreamService {
    IceCream saveIcream(String flavor, boolean flush = false) {
        IceCream iceCream = new IceCream(flavor: flavor)
        if ( !iceCream.save(flush: flush) ) {
            log.error 'Failure while saving icream {}', iceCream.errors.toString()
        }
        iceCream
    }
    @ReadOnly
    int count() {
        IceCream.count() as int
    }

package demo

import grails.gorm.transactions.ReadOnly
import grails.gorm.transactions.Transactional
import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j

@Slf4j
@Transactional
@CompileStatic
class RoleService {
    Role saveRole(String authority, boolean flush = false) {
        Role r = new Role(authority: authority)
        if ( !r.save(flush: flush) ) {
            log.error 'Failure while saving role {}', r.errors.toString()
        }
        r
    }
    @ReadOnly
    int count() {
        Role.count() as int
    }

package demo

import grails.gorm.DetachedCriteria
import grails.gorm.transactions.ReadOnly
import grails.gorm.transactions.Transactional
import groovy.util.logging.Slf4j

@Slf4j
@Transactional
class UserService {
    User createUser(String username, String password, boolean flush = false) {
        User user = new User(username: username, password: password)
        if ( !user.save(flush: flush) ) {
            log.error 'Unable to save user {}', user.errors.toString()
        }
        user
    }

package demo

import grails.gorm.transactions.Transactional
import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j

@Slf4j
@Transactional
@CompileStatic
class UserRoleService {
    UserRole saveUserRole(User user, Role role, boolean flush = false) {
        UserRole ur = new UserRole(user: user, role: role)
        if ( !ur.save(flush: flush) ) {
            log.error 'Failure while saving user {}', ur.errors.toString()
        }
        ur
    }

compile 'org.grails.plugins:spring-security-core:3.2.0.M1'
compile "org.grails.plugins:spring-security-rest:2.0.0.M2"

grails:
    plugin:
        springsecurity:
            userLookup:
                userDomainClassName: demo.User
                authorityJoinClassName: demo.UserRole
            authority:
                className: demo.Role
            rest:
                login:
                    endpointUrl: /login
            useSecurityEventListener: true
            controllerAnnotations:
                staticRules:
                    -
                        pattern: /stomp/**
                        access:
                            - permitAll
                    -
                        pattern: /signup/**
                        access:
                            - permitAll
            filterChain:
                chainMap:
                    - # Stateless chain
                        pattern: /**
                        filters: 'JOINED_FILTERS,-exceptionTranslationFilter,-authenticationProcessingFilter,-securityContextPersistenceFilter,-rememberMeAuthenticationFilter'

package demo

import groovy.transform.EqualsAndHashCode
import groovy.transform.ToString
import grails.compiler.GrailsCompileStatic

@GrailsCompileStatic
@EqualsAndHashCode(includes='username')
class User implements Serializable {

    String username
    String password
    Date lastLogin = null (1)
    boolean enabled = true
    boolean accountExpired
    boolean accountLocked
    boolean passwordExpired

    Set<Role> getAuthorities() {
        (UserRole.findAllByUser(this) as List<UserRole>)*.role as Set<Role>
    }

    static constraints = {
        password nullable: false, blank: false, password: true
        username nullable: false, blank: false, unique: true
        lastLogin nullable: true
    }

    static mapping = {
        table 'users'
        password column: '`password`', type: 'text'
        id name: 'username', generator: 'assigned'
        version false
    }
}

package demo

import groovy.transform.EqualsAndHashCode
import groovy.transform.ToString
import grails.compiler.GrailsCompileStatic
import org.springframework.security.core.GrantedAuthority

@GrailsCompileStatic
@EqualsAndHashCode(includes='authority')
@ToString(includes='authority', includeNames=true, includePackage=false)
class Role implements Serializable, GrantedAuthority {

    private static final long serialVersionUID = 1

    String authority

    static constraints = {
        authority nullable: false, blank: false, unique: true
    }

    static mapping = {
        cache true
    }
}

package demo

import grails.gorm.DetachedCriteria
import groovy.transform.ToString

import org.codehaus.groovy.util.HashCodeHelper
import grails.compiler.GrailsCompileStatic

@GrailsCompileStatic
@ToString(cache=true, includeNames=true, includePackage=false)
class UserRole implements Serializable {

    private static final long serialVersionUID = 1

    User user
    Role role

    @Override
    boolean equals(other) {
        if (other instanceof UserRole) {
            other.userId == user?.username && other.roleId == role?.id
        }
    }

    @Override
    int hashCode() {
        int hashCode = HashCodeHelper.initHash()
        if (user) {
            hashCode = HashCodeHelper.updateHash(hashCode, user.username)
        }
        if (role) {
            hashCode = HashCodeHelper.updateHash(hashCode, role.id)
        }
        hashCode
    }

    static UserRole get(String username, long roleId) {
        criteriaFor(username, roleId).get()
    }

    static boolean exists(String username, long roleId) {
        criteriaFor(username, roleId).count()
    }

    private static DetachedCriteria criteriaFor(String name, long roleId) {
        UserRole.where {
            user.username == name &&
                    role == Role.load(roleId)
        }
    }

    static UserRole create(User user, Role role, boolean flush = false) {
        def instance = new UserRole(user: user, role: role)
        instance.save(flush: flush)
        instance
    }

    static boolean remove(User u, Role r) {
        if (u != null && r != null) {
            UserRole.where { user == u && role == r }.deleteAll()
        }
    }

    static int removeAll(User u) {
        u == null ? 0 : UserRole.where { user == u }.deleteAll() as int
    }

    static int removeAll(Role r) {
        r == null ? 0 : UserRole.where { role == r }.deleteAll() as int
    }

    static constraints = {
        user nullable: false
        role nullable: false, validator: { Role r, UserRole ur ->
            if (ur.user?.id) {
                if (UserRole.exists(ur.user.username, r.id)) {
                    return ['userRole.exists']
                }
            }
        }
    }

    static mapping = {
        id composite: ['user', 'role']
        version false
    }
}

package demo

import grails.plugin.springsecurity.SpringSecurityService
import org.grails.datastore.mapping.engine.event.AbstractPersistenceEvent
import org.grails.datastore.mapping.engine.event.EventType
import org.grails.datastore.mapping.engine.event.PreInsertEvent
import org.grails.datastore.mapping.engine.event.PreUpdateEvent
import org.hibernate.event.spi.PreDeleteEvent
import org.springframework.beans.factory.annotation.Autowired
import grails.events.annotation.gorm.Listener
import groovy.transform.CompileStatic

@CompileStatic
class UserPasswordEncoderListener {

    @Autowired
    SpringSecurityService springSecurityService

    @Listener(User)
    void onPreInsertEvent(PreInsertEvent event) {
        encodeUserPasswordForEvent(event)
    }

    @Listener(User)
    void onPreUpdateEvent(PreUpdateEvent event) {
        encodeUserPasswordForEvent(event)
    }

    private void encodeUserPasswordForEvent(AbstractPersistenceEvent event) {
        if (event.entityObject instanceof User) {
            User u = (event.entityObject as User)
            if (u.password && ((event instanceof  PreInsertEvent) || (event instanceof PreUpdateEvent && u.isDirty('password')))) {
                event.getEntityAccess().setProperty("password", encodePassword(u.password))
            }
        }
    }

    private String encodePassword(String password) {
        springSecurityService?.passwordEncoder ? springSecurityService.encodePassword(password) : password
    }
}

import demo.UserPasswordEncoderListener

// Place your Spring DSL code here
beans = {
    userPasswordEncoderListener(UserPasswordEncoderListener)
}

        get "/ice-cream/$username"(controller: 'iceCream', action: 'index')

package demo
import grails.plugin.springsecurity.SpringSecurityService
import grails.plugin.springsecurity.annotation.Secured
import groovy.transform.CompileDynamic
import groovy.transform.CompileStatic

@CompileStatic
@Secured(['ROLE_USER']) (1)
class IceCreamController {
    static responseFormats = ['json']

    static allowedMethods = [index: 'GET', save: 'POST', delete: 'DELETE',]
    IceCreamService iceCreamService

    UserIceCreamService userIceCreamService

    SpringSecurityService springSecurityService

    def index(Integer max) {
        String username = loggedUsername()
        if ( !username ) {
            render status: 404
            return
        }
        params.max = Math.min(max ?: 10, 100) (2)

        List<IceCream> iceCreams = userIceCreamService.findAllIceCreamsByUsername(username)
        [iceCreams: iceCreams] (3)
    }
    @CompileDynamic
    protected String loggedUsername() {
        springSecurityService.principal?.username as String
    }

package demo
import grails.gorm.transactions.ReadOnly
import grails.gorm.transactions.Transactional
import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j
import org.springframework.validation.ObjectError

@Slf4j
@Transactional
@CompileStatic
class UserIceCreamService {
    @ReadOnly
    List<IceCream> findAllIceCreamsByUsername(String loggedUsername) {
        UserIceCream.where {
            user.username == loggedUsername
        }.list()*.iceCream as List<IceCream>
    }
}

import demo.IceCream

model {
    Iterable<IceCream> iceCreams
}

json tmpl.icecream(iceCreams)

Unresolved directive in <stdin> - include::/home/runner/work/grails-vs-nodejs/grails-vs-nodejs/complete/server/grails-app/views/iceCream/_iceCream.gson[]

        post "/ice-cream/$username"(controller: 'iceCream', action: 'save')

package demo
import grails.plugin.springsecurity.SpringSecurityService
import grails.plugin.springsecurity.annotation.Secured
import groovy.transform.CompileDynamic
import groovy.transform.CompileStatic

@CompileStatic
@Secured(['ROLE_USER']) (1)
class IceCreamController {
    static responseFormats = ['json']

    static allowedMethods = [index: 'GET', save: 'POST', delete: 'DELETE',]
    IceCreamService iceCreamService

    UserIceCreamService userIceCreamService

    SpringSecurityService springSecurityService

    def save(String flavor) {
        String username = loggedUsername()
        if ( !username ) {
            render status: 404
            return
        }
        def id = iceCreamService.addIceCreamToUser(username, flavor)?.id
        render id ?: [status: 500]
    }
    @CompileDynamic
    protected String loggedUsername() {
        springSecurityService.principal?.username as String
    }

package demo

import grails.compiler.GrailsCompileStatic
import grails.gorm.DetachedCriteria
import grails.gorm.transactions.ReadOnly
import grails.gorm.transactions.Transactional
import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j
import org.springframework.validation.ObjectError
@Slf4j
@CompileStatic
@Transactional
class IceCreamService {
    /**
     * @return null if an error occurs while saving the ice cream or the association between icream and user
     */
    @GrailsCompileStatic
    IceCream addIceCreamToUser(String username, String iceCreamFlavor, boolean flush = false) {
        User user = userService.findByUsername(username)
        if ( !user ) {
            log.error 'User {} does not exist', username
            return null
        }
        IceCream iceCream = findQueryByFlavor(iceCreamFlavor).get() ?: new IceCream(flavor: iceCreamFlavor)

        if(!iceCream.save(flush: flush)) {
            iceCream.errors.allErrors.each { ObjectError error ->
                log.error(error.toString())
            }
            return null
        }
        UserIceCream userIceCream = userIceCreamService.create(user, iceCream, flush)
        if ( userIceCream.hasErrors() ) {
            return null
        }
        iceCream
    }
}

        delete "/ice-cream/$username/$id"(controller: 'iceCream', action: 'delete')

package demo
import grails.plugin.springsecurity.SpringSecurityService
import grails.plugin.springsecurity.annotation.Secured
import groovy.transform.CompileDynamic
import groovy.transform.CompileStatic

@CompileStatic
@Secured(['ROLE_USER']) (1)
class IceCreamController {
    static responseFormats = ['json']

    static allowedMethods = [index: 'GET', save: 'POST', delete: 'DELETE',]
    IceCreamService iceCreamService

    UserIceCreamService userIceCreamService

    SpringSecurityService springSecurityService

    def delete(Long id) {
        String username = loggedUsername()
        if ( !username ) {
            render status: 404
            return
        }
        respond iceCreamService.removeIceCreamFromUser(username, id) ?: [status: 500]
    }
    @CompileDynamic
    protected String loggedUsername() {
        springSecurityService.principal?.username as String
    }

package demo

import grails.compiler.GrailsCompileStatic
import grails.gorm.DetachedCriteria
import grails.gorm.transactions.ReadOnly
import grails.gorm.transactions.Transactional
import groovy.transform.CompileStatic
import groovy.util.logging.Slf4j
import org.springframework.validation.ObjectError
@Slf4j
@CompileStatic
@Transactional
class IceCreamService {
    Boolean removeIceCreamFromUser(String loggedUsername, Long id) {
        IceCream iceCreamEntity = IceCream.load(id)
        User loggedUser = User.load(loggedUsername)
        UserIceCream.where {
            user == loggedUser && iceCream == iceCreamEntity
        }.deleteAll()
    }
}

compile 'org.grails.plugins:grails-spring-websocket:2.3.0'

package demo

import grails.plugin.springwebsocket.DefaultWebSocketConfig
import groovy.util.logging.Slf4j
import org.springframework.beans.factory.annotation.Value
import org.springframework.context.annotation.Configuration
import org.springframework.web.socket.config.annotation.EnableWebSocketMessageBroker
import org.springframework.web.socket.config.annotation.StompEndpointRegistry

@Slf4j
@Configuration
@EnableWebSocketMessageBroker
class CustomWebSocketConfig extends DefaultWebSocketConfig {

    @Value('${allowedOrigin}')
    String allowedOrigin (1)

    @Override
    void registerStompEndpoints(StompEndpointRegistry stompEndpointRegistry) { (2)
        log.info 'registerStompEndpoints with allowedOrigin: {}', allowedOrigin
        stompEndpointRegistry.addEndpoint("/stomp").setAllowedOrigins(allowedOrigin).withSockJS()
    }
}

package demo

import org.springframework.context.ApplicationListener
import grails.plugin.springsecurity.rest.RestTokenCreationEvent

class TokenCreationEventListener implements ApplicationListener<RestTokenCreationEvent> {

    void onApplicationEvent(RestTokenCreationEvent event) { (1)

        User.withTransaction { (2)
            User user = User.where { username == event.principal.username }.first()
            user.lastLogin = new Date()
            user.save(flush: true)
        }
    }
}

package demo


import groovy.time.TimeCategory
import org.springframework.beans.factory.annotation.Autowired
import org.springframework.beans.factory.annotation.Value
import org.springframework.messaging.simp.SimpMessagingTemplate
import org.springframework.scheduling.annotation.Scheduled

class SessionExpirationJobHolder {

    @Autowired
    SimpMessagingTemplate brokerMessagingTemplate (1)

    @Value('${timeout.minutes}') (2)
    Integer timeout

    @Scheduled(cron = "0 * * * * *") (3)
    void findExpiredSessions() {
        Date timeoutDate
        use( TimeCategory ) { (4)
            timeoutDate = new Date() - timeout.minutes
        }

        User.withTransaction {
            List<User> expiredUsers = User.where { //Query for loggedIn users with a lastLogin date after the timeout limit
                lastLogin != null
                lastLogin < timeoutDate
            }.list()

            //Iterate over the expired users
            expiredUsers.each { user ->
                user.lastLogin = null //Reset lastLogin date
                user.save(flush: true)

                (5)
                brokerMessagingTemplate.convertAndSend "/topic/${user.username}".toString(), "logout"
            }
        }
    }
}

import demo.UserPasswordEncoderListener
import demo.SessionExpirationJobHolder
import demo.TokenCreationEventListener
import demo.CustomWebSocketConfig

// Place your Spring DSL code here
beans = {
    userPasswordEncoderListener(UserPasswordEncoderListener) (1)
    webSocketConfig(CustomWebSocketConfig)                 (2)
    tokenCreationEventListener(TokenCreationEventListener) (3)
    sessionExpirationJobHolder(SessionExpirationJobHolder) (4)
}

package demo

import grails.boot.GrailsApp
import grails.boot.config.GrailsAutoConfiguration

@EnableScheduling
class Application extends GrailsAutoConfiguration {
    static void main(String[] args) {
        GrailsApp.run(Application, args)
    }
}

allowedOrigin: https://localhost:3000 # accepted origin URL for websocket connections
timeout:
    minutes: 1 #config setting for timeout

~ cd ../
~ git clone https://github.com/mvolkmann/ice-cream-app tmp
~ cp -Rv tmp/* ice-cream/client/

~ cd ice-cream/client
~ rm -rf database/ server/ css/ images/

-rw-r--r--  LICENSE
-rw-r--r--  README.md
drwxr-xr-x  build
-rw-r--r--  build.gradle
drwxr-xr-x  node_modules
-rw-r--r--  package.json
drwxr-xr-x  public
drwxr-xr-x  src
-rw-r--r--  yarn.lock

-rw-r--r--  App.css
-rw-r--r--  App.js
-rw-r--r--  App.test.js
-rw-r--r--  config.js
-rw-r--r--  ice-cream-entry.js
-rw-r--r--  ice-cream-list.js
-rw-r--r--  ice-cream-row.js
-rw-r--r--  index.css
-rw-r--r--  index.js
-rw-r--r--  login.js
-rw-r--r--  main.js

{
  "name": "ice-cream-app",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "eslint": "^3.17.1",
    "eslint-plugin-flowtype": "^2.30.3",
    "eslint-plugin-react": "^6.10.0",
    "react-scripts": "0.8.4"
  },
  "dependencies": {
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "sockjs-client": "^1.1.4",
    "stompjs": "^2.3.3"
  },
  "scripts": {
    "build": "react-scripts build",
    "coverage": "npm test -- --coverage",
    "lint": "eslint src/**/*.js server/**/*.js",
    "start": "react-scripts start",
    "test": "react-scripts test --env=jsdom"
  }
}

import pjson from './../package.json';

export const SERVER_URL = 'http://localhost:8080';
export const CLIENT_VERSION = pjson.version;
export const REACT_VERSION = pjson.dependencies.react;

import React, {Component, PropTypes as t} from 'react';
import 'whatwg-fetch';

function onChangePassword(event) {
  React.setState({password: event.target.value});
}

function onChangeUsername(event) {
  React.setState({username: event.target.value});
}

class Login extends Component {
  static propTypes = {
    password: t.string.isRequired,
    restUrl: t.string.isRequired,
    username: t.string.isRequired,
    timeoutHandler: t.func //NEW: propType for our timeoutHander function
  };

  // This is called when the "Log In" button is pressed.
  onLogin = async () => {
    const {password, restUrl, username, timeoutHandler} = this.props;
    const url = `${restUrl}/login`;

    try {
      // Send username and password to login REST service.
      const res = await fetch(url, {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({username, password})
      });

      if (res.ok) { // successful login
        const text = await res.text(); // returns a promise

        //NEW: Spring Security REST returns the token in the response body, not the Authorization header
        const token = `Bearer ${JSON.parse(text).access_token}`;

        React.setState({
          authenticated: true,
          error: null, // clear previous error
          route: 'main',
          token
        });

        timeoutHandler(username) //NEW: Connects to a user-specific websocket channel

      } else { //NEW: Any error response from the server indicates a failed login
        const msg = "Invalid username or password";
        React.setState({error: msg});
      }
    } catch (e) {
      React.setState({error: `${url}; ${e.message}`});
    }
  }

  // This is called when the "Signup" button is pressed.
  onSignup = async () => {
    const {password, restUrl, username, timeoutHandler} = this.props;
    const url = `${restUrl}/signup`;

    try {
      const res = await fetch(url, {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({username, password})
      });

      if (res.ok) { // successful signup
        const text = await res.text(); // returns a promise
        const token = `Bearer ${JSON.parse(text).access_token}`; //NEW: See above

        React.setState({
          authenticated: true,
          error: null, // clear previous error
          route: 'main',
          token
        });

        timeoutHandler(username) //NEW: Connect to user-specific websocket channel


      } else { // unsuccessful signup
        let text = await res.text(); // returns a promise
        if (/duplicate key/.test(text)) {
          text = `User ${username} already exists`;
        }
        React.setState({error: text});
      }
    } catch (e) {
      React.setState({error: `${url}; ${e.message}`});
    }
  };

  render() {
    const {password, username} = this.props;
    const canSubmit = username && password;

    // We are handling sending the username and password
    // to a REST service above, so we don't want
    // the HTML form to submit anything for us.
    // That is the reason for the call to preventDefault.
    return (
      <form className="login-form"
            onSubmit={event => event.preventDefault()}>
        <div className="row">
          <label>Username:</label>
          <input type="text"
                 autoFocus
                 onChange={onChangeUsername}
                 value={username}
          />
        </div>
        <div className="row">
          <label>Password:</label>
          <input type="password"
                 onChange={onChangePassword}
                 value={password}
          />
        </div>
        <div className="row submit">
          {/* Pressing enter in either input invokes the first button. */}
          <button disabled={!canSubmit} onClick={this.onLogin}>
            Log In
          </button>
          <button disabled={!canSubmit} onClick={this.onSignup}>
            Signup
          </button>
        </div>
      </form>
    );
  }
}

export default Login;

import React, {Component} from 'react';
import Login from './login';
import Main from './main';
import 'whatwg-fetch'; // for REST calls
import {SERVER_URL} from './config'; //NEW: Base url for REST calls
import './App.css';

// This allows the client to listen to sockJS events
// emitted from the server.  It is used to proactively
// terminate sessions when the session timeout expires.
import SockJS from 'sockjs-client'; //NEW: SockJS & Stomp instead of socket.io
import Stomp from 'stompjs';

class App extends Component {
  constructor() {
    super();

    // Redux is a popular library for managing state in a React application.
    // This application, being somewhat small, opts for a simpler approach
    // where the top-most component manages all of the state.
    // Placing a bound version of the setState method on the React object
    // allows other components to call it in order to modify state.
    // Each call causes the UI to re-render,
    // using the "Virtual DOM" to make this efficient.
    React.setState = this.setState.bind(this);
  }

  //NEW: Remove the top-level websocket config in favor of user-specific channels (set on login)

  // This is the initial state of the application.
  state = {
    authenticated: false,
    error: '',
    flavor: '',
    iceCreamMap: {},
    password: '',
    restUrl: SERVER_URL, //NEW: Use our SERVER_URL variable
    route: 'login', // controls the current page
    token: '',
    username: ''
  };

  /**
   * NEW: Clears the token and redirects to the login page.
   * No logout API call is needed because JWT tokens
   * expire w/o state changes on the server */
  logout = async () => {
      React.setState({
        authenticated: false,
        route: 'login',
        password: '',
        username: ''
      });
  };

  /**
  * NEW: This function will be passed into the Login component as a prop
  * This gets a SockJS connection from the server
  * and subscribes to a "topic/[username]" channel for timeout events.
  * If one is received, the user is logged out. */
  timeoutHandler = (username) => {
    const socket = new SockJS(`${SERVER_URL}/stomp`);
    const client = Stomp.over(socket);

    client.connect({}, () => {
      client.subscribe(`/topic/${username}`, () => {
        alert('Your session timed out.');
        this.logout();
      });
    }, () => {
      console.error('unable to connect');
    });
  };

  render() {
    // Use destructuring to extract data from the state object.
    const {
      authenticated, error, flavor, iceCreamMap,
      password, restUrl, route, token, username
    } = this.state;

    return (
      <div className="App">
        <header>
          <img className="header-img" src="ice-cream.png" alt="ice cream" />
          Ice cream, we all scream for it!
          {
            authenticated ?
              <button onClick={this.logout}>Log out</button> :
              null
          }
        </header>
        <div className="App-body">
          {
            // This is an alternative to controlling routing to pages
            // that is far simpler than more full-blown solutions
            // like react-router.
            route === 'login' ?
              <Login
                username={username}
                password={password}
                restUrl={restUrl}
                timeoutHandler={this.timeoutHandler} //NEW: Pass our timeoutHandler as a prop to <Login>
              /> :
            route === 'main' ?
              <Main
                flavor={flavor}
                iceCreamMap={iceCreamMap}
                restUrl={restUrl}
                token={token}
                username={username}
              /> :
              <div>Unknown route {route}</div>
          }
          {
            // If an error has occurred, render it at the bottom of any page.
            error ? <div className="error">{error}</div> : null
          }
        </div>
      </div>
    );
  }
}

export default App;

~ ./gradlew server:bootRun
Grails application running at http://localhost:8443 in environment: development

~ export HTTPS = true
~ ./gradlew client:bootRun
Starting the development server...

Compiled successfully!

The app is running at:

  https://localhost:3000/