diff --git a/JamiDaemon.js b/JamiDaemon.js
index 3314516..2e5e478 100755
--- a/JamiDaemon.js
+++ b/JamiDaemon.js
@@ -27,14 +27,16 @@
 class JamiDaemon {
     constructor(onMessage) {
         this.accounts = []
+        this.lookups = []
+        this.tempAccounts = []
         this.dring = require("./dring.node")
         this.dring.init({
             "AccountsChanged": () => {
                 console.log("AccountsChanged")
                 const newAccounts = []
                 JamiDaemon.vectToJs(this.dring.getAccountList()).forEach(accountId => {
-                    for (const account in this.accounts) {
-                        if (account.id === accountId) {
+                    for (const account of this.accounts) {
+                        if (account.getId() === accountId) {
                             newAccounts.push(account)
                             return
                         }
@@ -77,47 +79,51 @@
                     //io.emit('receivedMessage', message["text/plain"])
                 }*/
             },
-            "RegistrationStateChanged": (accountId, state, /*int*/ code, detail) => {
-                const account = this.getAccount(accountId)
-                if (!account) {
-                    console.log(`Unknown account ${accountId}`)
-                    return
-                }
-                account.registrationState = state
+            "RegistrationStateChanged": (accountId, state, code, detail) => {
                 console.log("RegistrationStateChanged: " + accountId + " " + state + " " + code + " " + detail)
-                if (state === "REGISTERED") {
-                    /*if (tempAccounts[accountId]) {
-
-                        const ctx = tempAccounts[accountId]
-                        ctx.newUser.accountId = accountId
-                        ctx.newUser.jamiId = jami.dring.getAccountDetails(accountId).get("Account.username")
-                        //connectedUsers[accountId] = ctx.newUser
-                        ctx.done(null, ctx.newUser)
-                        delete tempAccounts[accountId]
-                    }*/
-                } else if (state === "ERROR_AUTH") {
-                    //done(null, false)
-                    //remove account
+                const account = this.getAccount(accountId)
+                if (account) {
+                    account.registrationState = state
+                } else {
+                    console.log(`Unknown account ${accountId}`)
+                }
+                const ctx = this.tempAccounts[accountId]
+                if (ctx) {
+                    if (state === "REGISTERED") {
+                        account.details = JamiDaemon.mapToJs(this.dring.getAccountDetails(accountId))
+                        ctx.resolve(accountId)
+                        delete this.tempAccounts[accountId]
+                    } else if (state === "ERROR_AUTH") {
+                        this.dring.removeAccount(accountId)
+                        ctx.reject(state)
+                        delete this.tempAccounts[accountId]
+                    }
                 }
             },
             "RegisteredNameFound": (accountId, state, address, name) => {
                 console.log(`RegisteredNameFound: ${accountId} ${state} ${address} ${name}`)
-                const account = this.getAccount(accountId)
-                if (!account) {
-                    console.log(`Unknown account ${accountId}`)
-                    return
+                let lookups
+                if (accountId) {
+                    const account = this.getAccount(accountId)
+                    if (!account) {
+                        console.log(`Unknown account ${accountId}`)
+                        return
+                    }
+                    if (state == 0) {
+                        const contact = account.getContactFromCache(address)
+                        if (!contact.isRegisteredNameResolved())
+                            contact.setRegisteredName(name)
+                    }
+                    lookups = account.lookups
+                } else {
+                    lookups = this.lookups
                 }
-                if (state == 0) {
-                    const contact = account.getContactFromCache(address)
-                    if (!contact.isRegisteredNameResolved())
-                        contact.setRegisteredName(name)
-                }
-                let index = account.lookups.length - 1
+                let index = lookups.length - 1
                 while (index >= 0) {
-                    const lookup = account.lookups[index]
+                    const lookup = lookups[index]
                     if ((lookup.address && lookup.address === address) || (lookup.name && lookup.name === name)) {
                         lookup.resolve({address, name, state})
-                        account.lookups.splice(index, 1)
+                        lookups.splice(index, 1)
                     }
                     index -= 1
                 }
@@ -235,10 +241,13 @@
         })
     }
 
-    addAccount(account) {
-        const params = accountDetailsToNative(account)
+    addAccount(accountConfig) {
+        const params = this.accountDetailsToNative(accountConfig)
         params.set("Account.type", "RING")
-        return this.dring.addAccount(params)
+        return new Promise((resolve, reject) => {
+            const accountId = this.dring.addAccount(params)
+            this.tempAccounts[accountId] = { resolve, reject }
+        })
     }
     getAccount(accountId) {
         for (let i = 0; i < this.accounts.length; i++) {
@@ -275,28 +284,36 @@
 
     lookupName(accountId, name) {
         const p = new Promise((resolve, reject) => {
-            const account = this.getAccount(accountId)
-            if (!account) {
-                reject(new Error("Can't find account"))
+            if (accountId) {
+                const account = this.getAccount(accountId)
+                if (!account) {
+                    reject(new Error("Can't find account"))
+                } else {
+                    account.lookups.push({ name, resolve, reject })
+                }
             } else {
-                account.lookups.push({name, resolve, reject})
+                this.lookups.push({ name, resolve, reject })
             }
         })
-        this.dring.lookupName(accountId, "", name)
+        this.dring.lookupName(accountId || '', '', name)
         return p
     }
 
     lookupAddress(accountId, address) {
         console.log(`lookupAddress ${accountId} ${address}`)
         const p = new Promise((resolve, reject) => {
-            const account = this.getAccount(accountId)
-            if (!account) {
-                reject(new Error("Can't find account"))
+            if (accountId) {
+                const account = this.getAccount(accountId)
+                if (!account) {
+                    reject(new Error("Can't find account"))
+                } else {
+                    account.lookups.push({ address, resolve, reject })
+                }
             } else {
-                account.lookups.push({address, resolve, reject})
+                this.lookups.push({ address, resolve, reject })
             }
         })
-        this.dring.lookupAddress(accountId, "", address)
+        this.dring.lookupAddress(accountId || '', '', address)
         return p
     }
 
@@ -372,23 +389,25 @@
             params.set("Account.managerUsername", account.managerUsername)
         if (account.archivePassword) {
             params.set("Account.archivePassword", account.archivePassword)
-        } else {
+        }/* else {
             console.log("archivePassword required")
             return
-        }
+        }*/
         if (account.alias)
             params.set("Account.alias", account.alias)
         if (account.displayName)
             params.set("Account.displayName", account.displayName)
-        if (account.enable)
+        if (account.enable !== undefined)
             params.set("Account.enable", this.boolToStr(account.enable))
-        if (account.autoAnswer)
+        if (account.autoAnswer !== undefined)
+            params.set("Account.autoAnswer", this.boolToStr(account.autoAnswer))
+        if (account.autoAnswer !== undefined)
             params.set("Account.autoAnswer", this.boolToStr(account.autoAnswer))
         if (account.ringtonePath)
             params.set("Account.ringtonePath", account.ringtonePath)
-        if (account.ringtoneEnabled)
+        if (account.ringtoneEnabled !== undefined)
             params.set("Account.ringtoneEnabled", this.boolToStr(account.ringtoneEnabled))
-        if (account.videoEnabled)
+        if (account.videoEnabled !== undefined)
             params.set("Account.videoEnabled", this.boolToStr(account.videoEnabled))
         if (account.useragent) {
             params.set("Account.useragent", account.useragent)
@@ -406,15 +425,15 @@
             params.set("Account.videoPortMax", account.videoPortMax)
         if (account.localInterface)
             params.set("Account.localInterface", account.localInterface)
-        if (account.publishedSameAsLocal)
+        if (account.publishedSameAsLocal !== undefined)
             params.set("Account.publishedSameAsLocal", this.boolToStr(account.publishedSameAsLocal))
         if (account.localPort)
             params.set("Account.localPort", account.localPort)
         if (account.publishedPort)
             params.set("Account.publishedPort", account.publishedPort)
-        if (account.publishedAddress)
-            params.set("Account.publishedAddress", account.publishedAddress)
-        if (account.upnpEnabled)
+        if (account.rendezVous !== undefined)
+            params.set("Account.rendezVous", this.boolToStr(account.rendezVous))
+        if (account.upnpEnabled !== undefined)
             params.set("Account.upnpEnabled", this.boolToStr(account.upnpEnabled))
         return params
     }
diff --git a/client/package.json b/client/package.json
index 5c4cc03..8fd8540 100644
--- a/client/package.json
+++ b/client/package.json
@@ -15,6 +15,7 @@
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
     "react-emoji-render": "^1.2.4",
+    "react-fetch-hook": "^1.8.5",
     "react-router-dom": "^5.2.0",
     "react-sound": "^1.2.0",
     "socket.io-client": "^4.0.1"
diff --git a/client/src/App.js b/client/src/App.js
index b500052..bfe707e 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -4,8 +4,7 @@
   License: AGPL-3
 */
 import React, { useState, useEffect } from 'react'
-import { Route, Switch, Redirect, useHistory, useLocation } from 'react-router-dom'
-import { CircularProgress, Container, CssBaseline } from '@material-ui/core'
+import { Route, Switch, Redirect } from 'react-router-dom'
 import authManager from './AuthManager'
 //import logo from './logo.svg'
 import './App.scss'
@@ -15,12 +14,12 @@
 import AccountSettings from "./pages/accountSettings.jsx"
 import AccountSelection from "./pages/accountSelection.jsx"
 import ServerSetup from "./pages/serverSetup.jsx"
+import AccountCreationDialog from "./pages/accountCreation.jsx"
 import NotFoundPage from "./pages/404.jsx"
 import LoadingPage from './components/loading'
+import JamiAccountDialog from './pages/jamiAccountCreation.jsx'
 
 const App = (props) => {
-    const history = useHistory()
-    const { location } = useLocation()
     const [state, setState] = useState({
       loaded: false,
       auth: authManager.getState()
@@ -48,6 +47,8 @@
           <Route path="/account/:accountId/conversation/:conversationId" component={JamiMessenger} />
           <Route path="/account/:accountId" component={JamiMessenger} />
           <Route path="/account" component={AccountSelection} />
+          <Route path="/newAccount/jami" component={JamiAccountDialog} />
+          <Route path="/newAccount" component={AccountCreationDialog} />
           <Route component={NotFoundPage} />
         </Switch>
       {!state.auth.authenticated && <SignInPage open={!state.auth.authenticated}/>}
diff --git a/client/src/AuthManager.js b/client/src/AuthManager.js
index c256d51..d6cc6b6 100644
--- a/client/src/AuthManager.js
+++ b/client/src/AuthManager.js
@@ -72,6 +72,9 @@
                 }
                 if (this.onAuthChanged)
                     this.onAuthChanged(this.state)
+            }).catch(e => {
+                this.authenticating = false
+                console.log(e)
             })
     }
 
@@ -125,6 +128,9 @@
                     else
                         task.reject(new Error("Authentication failed"))
                 }
+            }).catch(e => {
+                this.authenticating = false
+                console.log(e)
             })
     }
 
diff --git a/client/src/components/AccountList.js b/client/src/components/AccountList.js
deleted file mode 100644
index 594c979..0000000
--- a/client/src/components/AccountList.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from 'react'
-import { List, ListItem, ListItemAvatar, ListItemText } from '@material-ui/core'
-import ConversationAvatar from './ConversationAvatar'
-
-export default function AccountList(props) {
-  return <List>
-    {
-      props.accounts.map(account => {
-        const displayName = account.getDisplayNameNoFallback()
-        return <ListItem button key={account.getId()} onClick={() => props.onClick(account)}>
-          <ListItemAvatar>
-            <ConversationAvatar displayName={displayName} />
-          </ListItemAvatar>
-          <ListItemText primary={account.getDisplayName()} secondary={account.getDisplayUri()} />
-        </ListItem>
-      })
-    }
-  </List>
-}
diff --git a/client/src/components/ConversationAvatar.js b/client/src/components/ConversationAvatar.js
index b9160a1..601fcf6 100644
--- a/client/src/components/ConversationAvatar.js
+++ b/client/src/components/ConversationAvatar.js
@@ -1,7 +1,9 @@
-import React from 'react';
-import { Avatar } from '@material-ui/core';
+import React from 'react'
+import { Avatar } from '@material-ui/core'
 import { PersonRounded } from '@material-ui/icons'
 
 export default function ConversationAvatar(props) {
-  return <Avatar>{props.displayName ? props.displayName[0].toUpperCase() : <PersonRounded />}</Avatar>
+  return <Avatar>
+    {props.displayName ? props.displayName[0].toUpperCase() : <PersonRounded />}
+  </Avatar>
 }
diff --git a/client/src/components/ListItemLink.js b/client/src/components/ListItemLink.js
new file mode 100644
index 0000000..8ff17d1
--- /dev/null
+++ b/client/src/components/ListItemLink.js
@@ -0,0 +1,30 @@
+import React, { useMemo, forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import ListItem from '@material-ui/core/ListItem';
+import ListItemIcon from '@material-ui/core/ListItemIcon';
+import ListItemText from '@material-ui/core/ListItemText';
+import { Link as RouterLink } from 'react-router-dom';
+
+function ListItemLink(props) {
+  const { icon, primary, secondary, to } = props
+
+  const renderLink = useMemo(
+    () => forwardRef((itemProps, ref) => <RouterLink to={to} ref={ref} {...itemProps} />),
+    [to])
+
+  return (
+    <ListItem button component={renderLink}>
+      {icon ? <ListItemIcon>{icon}</ListItemIcon> : null}
+      <ListItemText primary={primary} secondary={secondary} />
+    </ListItem>
+  )
+}
+
+ListItemLink.propTypes = {
+  icon: PropTypes.element,
+  primary: PropTypes.string.isRequired,
+  secondary: PropTypes.string,
+  to: PropTypes.string.isRequired,
+}
+
+export default ListItemLink
\ No newline at end of file
diff --git a/client/src/components/Message.js b/client/src/components/Message.js
index f4b4f57..ab28177 100644
--- a/client/src/components/Message.js
+++ b/client/src/components/Message.js
@@ -8,9 +8,9 @@
     if (message.type == 'text/plain')
         return (<div className="message">
             <div className="message-avatar">
-                    <ConversationAvatar name="{message.author}" /></div>
-                    <Typography className="message-text">{message.body}</Typography>
-                </div>)
+                <ConversationAvatar name={message.author} /></div>
+            <Typography className="message-text">{message.body}</Typography>
+        </div>)
     else if (message.type == 'contact')
         return (<div className="contact-event">
             <Typography className="message-text">Contact event</Typography>
diff --git a/client/src/components/SendMessageForm.js b/client/src/components/SendMessageForm.js
index 82ee7af..fa7c0f2 100644
--- a/client/src/components/SendMessageForm.js
+++ b/client/src/components/SendMessageForm.js
@@ -37,8 +37,10 @@
 
   const handleSubmit = e => {
     e.preventDefault()
-    props.onSend(currentMessage)
-    setCurrentMessage('')
+    if (currentMessage) {
+      props.onSend(currentMessage)
+      setCurrentMessage('')
+    }
   }
   const handleInputChange = (event) => setCurrentMessage(event.target.value)
   const onEmojiClick = (e, emojiObject) => {
diff --git a/client/src/components/UsernameChooser.js b/client/src/components/UsernameChooser.js
new file mode 100644
index 0000000..3d795ce
--- /dev/null
+++ b/client/src/components/UsernameChooser.js
@@ -0,0 +1,48 @@
+import React, { useEffect, useState } from 'react'
+import usePromise from "react-fetch-hook/usePromise"
+import { InputAdornment, TextField } from '@material-ui/core'
+import { SearchRounded } from '@material-ui/icons'
+import authManager from '../AuthManager'
+
+const isInputValid = input => input && input.length > 2
+
+export default function UsernameChooser(props) {
+  const [query, setQuery] = useState('')
+
+  const { isLoading, data, error } = usePromise(() => isInputValid(query) ? authManager.fetch(`/api/ns/name/${query}`)
+    .then(res => {
+      if (res.status === 200)
+        return res.json()
+      else throw res.status
+    }) : new Promise((res, rej) => rej(400)),
+    [query])
+
+  useEffect(() => {
+    if (!isLoading) {
+      if (error === 404)
+        props.setName(query)
+      else
+        props.setName('')
+    }
+  }, [query, isLoading, data, error])
+
+  const handleChange = event => setQuery(event.target.value)
+
+  return (
+      <TextField
+        className="main-search-input"
+        type="search"
+        placeholder="Register a unique name"
+        error={!error}
+        label={isLoading ? 'Searching...' : (error && error !== 400 ? 'This name is available' : (data && data.address ? 'This name is not available' : ''))}
+        value={query}
+        disabled={props.disabled}
+        onChange={handleChange}
+        InputProps={{
+          startAdornment: (
+            <InputAdornment position="start"><SearchRounded /></InputAdornment>
+          )
+        }}
+      />
+  )
+}
diff --git a/client/src/index.scss b/client/src/index.scss
index 19e2639..05a3129 100644
--- a/client/src/index.scss
+++ b/client/src/index.scss
@@ -25,12 +25,10 @@
   display: grid;
   height: 100%;
   grid-template-columns: 320px 1fr;
-  grid-template-rows: 40px 50px 1fr 1fr 92px;
+  grid-template-rows: 40px 50px 1fr;
   grid-template-areas:
     "h m"
     "n m"
-    "r m"
-    "r m"
     "r m";
 }
 
diff --git a/client/src/pages/accountCreation.jsx b/client/src/pages/accountCreation.jsx
new file mode 100644
index 0000000..9fc30cf
--- /dev/null
+++ b/client/src/pages/accountCreation.jsx
@@ -0,0 +1,52 @@
+import React from 'react';
+import { Container, Card, CardContent, Typography, List, Avatar, Divider } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import { DialerSipRounded, GroupOutlined, RoomRounded } from '@material-ui/icons';
+import ListItemLink from '../components/ListItemLink';
+
+const useStyles = makeStyles((theme) => ({
+  wizardCard: {
+    borderRadius: 8,
+    maxWidth: 360,
+    margin: "16px auto"
+  }
+}))
+
+export default function AccountCreationDialog(props) {
+  const classes = useStyles()
+
+  return (
+    <Container>
+      <Card className={classes.wizardCard}>
+        <CardContent>
+          <Typography gutterBottom variant="h5" component="h2">
+            Create new account
+          </Typography>
+          <Typography variant="body2" color="textSecondary" component="p">
+            Welcome to the Jami web node setup.<br />
+            Let's start by creating a new administrator account to control access to the server configuration.
+          </Typography>
+        </CardContent>
+
+        <List className={classes.root}>
+          <ListItemLink
+            to="/newAccount/rendezVous"
+            icon={<Avatar><RoomRounded /></Avatar>}
+            primary="Rendez-vous point"
+            secondary="A Rendez-vous account provides a unique space suitable to easily organize meetings" />
+          <Divider />
+          <ListItemLink
+            to="/newAccount/jami"
+            icon={<Avatar><GroupOutlined /></Avatar>}
+            primary="Jami account"
+            secondary="A pesonal communication account to join a Rendez-vous point or directly contact other Jami users" />
+          <Divider />
+          <ListItemLink
+            to="/newAccount/sip"
+            icon={<Avatar><DialerSipRounded /></Avatar>}
+            primary="SIP Account"
+            secondary="Connect with standard SIP communication providers or classic telephony services" />
+        </List>
+      </Card>
+    </Container>)
+}
diff --git a/client/src/pages/accountSelection.jsx b/client/src/pages/accountSelection.jsx
index 40c0750..0cd9e29 100644
--- a/client/src/pages/accountSelection.jsx
+++ b/client/src/pages/accountSelection.jsx
@@ -1,11 +1,12 @@
 import React, { useEffect, useState } from 'react';
-import { withRouter } from 'react-router-dom';
-import { Card, CardHeader, Container, CircularProgress } from '@material-ui/core';
+import { Avatar, Card, CardHeader, Container, List } from '@material-ui/core';
 import Header from '../components/Header'
-import AccountList from '../components/AccountList';
 import authManager from '../AuthManager'
 import Account from '../../../model/Account';
 import LoadingPage from '../components/loading';
+import ListItemLink from '../components/ListItemLink';
+import ConversationAvatar from '../components/ConversationAvatar';
+import { AddRounded } from '@material-ui/icons';
 
 const AccountSelection = (props) => {
   const [state, setState] = useState({
@@ -30,7 +31,7 @@
           loaded: true,
           error: true
         })
-      })
+      }).catch(e => console.log(e))
     return () => controller.abort()
   }, [])
 
@@ -42,11 +43,21 @@
       <Container maxWidth="sm" style={{paddingBottom:32}}>
         <Card style={{marginTop:32, marginBottom:32}}>
           <CardHeader title="Choose an account" />
-          <AccountList accounts={state.accounts} onClick={account => props.history.push(`/account/${account.getId()}/settings`)} />
+          <List>
+            {state.accounts.map(account => <ListItemLink key={account.getId()}
+              icon={<ConversationAvatar displayName={account.getDisplayNameNoFallback()} />}
+              to={`/account/${account.getId()}/settings`}
+              primary={account.getDisplayName()}
+              secondary={account.getDisplayUri()} />)}
+            <ListItemLink
+              icon={<Avatar><AddRounded /></Avatar>}
+              to='/newAccount'
+              primary="Create new account" />
+          </List>
         </Card>
       </Container>
     </React.Fragment>
   )
 }
 
-export default withRouter(AccountSelection);
\ No newline at end of file
+export default AccountSelection
\ No newline at end of file
diff --git a/client/src/pages/jamiAccountCreation.jsx b/client/src/pages/jamiAccountCreation.jsx
new file mode 100644
index 0000000..2bd8ea9
--- /dev/null
+++ b/client/src/pages/jamiAccountCreation.jsx
@@ -0,0 +1,82 @@
+import React, { useState } from 'react';
+import { Container, Card, CardContent, Typography, Fab, CardActions, Box } from '@material-ui/core';
+import { makeStyles } from '@material-ui/core/styles';
+import { AddRounded } from '@material-ui/icons';
+import UsernameChooser from '../components/UsernameChooser';
+import authManager from '../AuthManager'
+import { useHistory } from 'react-router';
+
+const useStyles = makeStyles((theme) => ({
+  extendedIcon: {
+    marginRight: theme.spacing(1),
+  },
+  wizardCard: {
+    borderRadius: 8,
+    maxWidth: 360,
+    margin: "16px auto"
+  },
+  actionArea: {
+    textAlign: 'center',
+    display: 'block'
+  },
+  chooser: {
+    marginTop: 16
+  }
+}))
+
+export default function JamiAccountDialog(props) {
+  const classes = useStyles()
+  const [name, setName] = useState('')
+  const [loading, setLoading] = useState(false)
+  const [error, setError] = useState(false)
+  const history = useHistory()
+
+  const onSubmit = async event => {
+    event.preventDefault()
+    setLoading(true)
+    const result = await authManager.fetch('/api/accounts', {
+      method: 'POST',
+      headers: {
+        'Accept': 'application/json',
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({
+        'Account.registeredName': name
+      })
+    })
+      .then(res => res.json())
+      .catch(error => {
+        setLoading(false)
+        setError(error)
+      })
+    console.log(result)
+    if (result && result.accountId)
+      history.replace(`/account/${result.accountId}/settings`)
+  }
+
+  return (
+    <Container>
+      <Card component="form" onSubmit={onSubmit} className={classes.wizardCard}>
+        <CardContent>
+          <Typography gutterBottom variant="h5" component="h2">
+            Create Jami account
+          </Typography>
+          <Typography variant="body2" color="textSecondary" component="p">
+            Welcome to the Jami web node setup.<br />
+            Let's start by creating a new administrator account to control access to the server configuration.
+          </Typography>
+
+          <Box className={classes.chooser} >
+            <UsernameChooser disabled={loading} setName={setName} />
+          </Box>
+        </CardContent>
+        <CardActions className={classes.actionArea}>
+          {error && <Typography color="error">Error: {JSON.stringify(error)}</Typography>}
+          <Fab color="primary" type="submit" variant="extended" disabled={!name || loading}>
+            <AddRounded className={classes.extendedIcon} />
+            Register name
+          </Fab>
+        </CardActions>
+      </Card>
+    </Container>)
+}
diff --git a/client/webpack.config.js b/client/webpack.config.js
index 0e96882..7a2a6de 100644
--- a/client/webpack.config.js
+++ b/client/webpack.config.js
@@ -6,7 +6,6 @@
 const __dirname = dirname(__filename);
 
 import dotenv from 'dotenv'
-console.log(resolve(__dirname, '..', '.env'))
 dotenv.config({ path: resolve(__dirname, '..', '.env') })
 
 import { resolve } from 'path'
@@ -16,59 +15,66 @@
 
 let entry = [resolve(__dirname, 'src', 'index.js')]
 let plugins = [
-    new HtmlWebpackPlugin({template: resolve(__dirname, 'src', 'index.ejs')}),
-    new CopyWebpackPlugin({
-        patterns: [{ from: resolve(__dirname, 'public'), to: resolve(__dirname, 'dist') }]
-    })
+  new HtmlWebpackPlugin({ template: resolve(__dirname, 'src', 'index.ejs') }),
+  new CopyWebpackPlugin({
+    patterns: [{ from: resolve(__dirname, 'public'), to: resolve(__dirname, 'dist') }]
+  })
 ]
 let devtool = undefined
 let babelLoaderPlugins = ["@babel/plugin-transform-runtime"]
 
 if (mode === 'development') {
-    const webpack = (await import('webpack')).default
-    const ReactRefreshWebpackPlugin = (await import('@pmmmwh/react-refresh-webpack-plugin')).default
-    entry = ['webpack-hot-middleware/client', ...entry]
-    plugins = [new webpack.HotModuleReplacementPlugin(), new ReactRefreshWebpackPlugin(), ...plugins]
-    babelLoaderPlugins = [...babelLoaderPlugins, "react-refresh/babel"]
-    devtool = 'inline-source-map'
+  const webpack = (await import('webpack')).default
+  const ReactRefreshWebpackPlugin = (await import('@pmmmwh/react-refresh-webpack-plugin')).default
+  entry = ['webpack-hot-middleware/client', ...entry]
+  plugins = [new webpack.HotModuleReplacementPlugin(), new ReactRefreshWebpackPlugin(), ...plugins]
+  babelLoaderPlugins = [...babelLoaderPlugins, "react-refresh/babel"]
+  devtool = 'inline-source-map'
 }
 console.log(`Webpack configured for ${mode}`)
 
 export default {
-    entry,
-    output: {
-        path: resolve(__dirname, 'dist'),
-        filename: 'bundle.js',
-        publicPath: '/'
-    },
-    devtool,
-    mode,
-    module: {
-        rules: [
-            {
-                test: /\.jsx?/,
-                resolve: {
-                    fullySpecified: false
-                },
-                exclude: /node_modules/,
-                use: {
-                    loader: 'babel-loader',
-                    options: {
-                        plugins: babelLoaderPlugins,
-                        presets: [
-                            ['@babel/preset-env', {
-                                useBuiltIns: 'entry',
-                                corejs:{ version: "3.10", proposals: true },
-                            }],
-                            '@babel/preset-react']
-                    }
-                }
-            },
-            {
-                test: /\.s[ac]ss$/i,
-                use: ['style-loader', 'css-loader', 'sass-loader'],
-            }
-        ]
-    },
-    plugins
+  entry,
+  output: {
+    path: resolve(__dirname, 'dist'),
+    filename: 'bundle.js',
+    publicPath: '/'
+  },
+  devtool,
+  mode,
+  module: {
+    rules: [
+      {
+        test: /\.jsx?/,
+        resolve: {
+          fullySpecified: false
+        },
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            plugins: babelLoaderPlugins,
+            presets: [
+              ['@babel/preset-env', {
+                useBuiltIns: 'entry',
+                corejs: { version: '3.10', proposals: true },
+              }],
+              ['@babel/preset-react', {
+                runtime: 'automatic'
+              }]]
+          }
+        }
+      },
+      {
+        test: /\.s[ac]ss$/i,
+        use: ['style-loader', 'css-loader', 'sass-loader'],
+      },
+      {
+        test: /\.svg$/,
+        type: 'asset',
+        use: 'svgo-loader'
+      }
+    ]
+  },
+  plugins
 }
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 38b0508..4cea832 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -34,6 +34,7 @@
       }
     },
     "client": {
+      "name": "jami-web-client",
       "version": "0.1.0",
       "dev": true,
       "dependencies": {
@@ -48,6 +49,7 @@
         "react": "^16.13.1",
         "react-dom": "^16.13.1",
         "react-emoji-render": "^1.2.4",
+        "react-fetch-hook": "^1.8.5",
         "react-router-dom": "^5.2.0",
         "react-sound": "^1.2.0",
         "socket.io-client": "^4.0.1"
@@ -2759,9 +2761,9 @@
       }
     },
     "node_modules/acorn": {
-      "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.1.1.tgz",
-      "integrity": "sha512-xYiIVjNuqtKXMxlRMDc6mZUhXehod4a3gbZ1qRlM7icK4EbxUFNLhWoPblCvFtB2Y9CIqHP3CF/rdxLItaQv8g==",
+      "version": "8.2.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.2.1.tgz",
+      "integrity": "sha512-z716cpm5TX4uzOzILx8PavOE6C6DKshHDw1aQN52M/yNSqE9s5O8SMfyhCCfCJ3HmTL0NkVOi+8a/55T7YB3bg==",
       "dev": true,
       "bin": {
         "acorn": "bin/acorn"
@@ -5086,9 +5088,9 @@
       }
     },
     "node_modules/is-core-module": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.2.0.tgz",
-      "integrity": "sha512-XRAfAdyyY5F5cOXn7hYQDqh2Xmii+DEfIcQGxK/uNwMHhIkPWO0g8msXcbzLe+MpGoR951MlqM/2iIlU4vKDdQ==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.3.0.tgz",
+      "integrity": "sha512-xSphU2KG9867tsYdLD4RWQ1VqdFl4HTO9Thf3I/3dLEfr0dbPTWKsuCKrgqMljg4nPE+Gq0VCnzT3gr0CyBmsw==",
       "dev": true,
       "dependencies": {
         "has": "^1.0.3"
@@ -6886,6 +6888,15 @@
       "integrity": "sha512-PAHp6TxrCy7MGMFidro8uikr+zlJJKJ/Q6mm2ExZ7HwkyR9lSVFfE3kt36qcwa24BQL7y0G9axycGjK1A/0uNQ==",
       "dev": true
     },
+    "node_modules/react-fetch-hook": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmjs.org/react-fetch-hook/-/react-fetch-hook-1.8.5.tgz",
+      "integrity": "sha512-HRkfFAGGS6u3xknFWvgNQBUBRkM0ZZnUlyv4yVy2e+ZijUDOPJ+CwgpZ5nvrNd6QVU8++KcV/9WSe3TyW/N/rA==",
+      "dev": true,
+      "peerDependencies": {
+        "react": ">=16.8.0 <18.0.0"
+      }
+    },
     "node_modules/react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
@@ -8232,9 +8243,9 @@
       }
     },
     "node_modules/webpack": {
-      "version": "5.35.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.35.0.tgz",
-      "integrity": "sha512-au3gu55yYF/h6NXFr0KZPZAYxS6Nlc595BzYPke8n0CSff5WXcoixtjh5LC/8mXunkRKxhymhXmBY0+kEbR6jg==",
+      "version": "5.35.1",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.35.1.tgz",
+      "integrity": "sha512-uWKYStqJ23+N6/EnMEwUjPSSKUG1tFmcuKhALEh/QXoUxwN8eb3ATNIZB38A+fO6QZ0xfc7Cu7KNV9LXNhDCsw==",
       "dev": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.0",
@@ -10668,9 +10679,9 @@
       }
     },
     "acorn": {
-      "version": "8.1.1",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.1.1.tgz",
-      "integrity": "sha512-xYiIVjNuqtKXMxlRMDc6mZUhXehod4a3gbZ1qRlM7icK4EbxUFNLhWoPblCvFtB2Y9CIqHP3CF/rdxLItaQv8g==",
+      "version": "8.2.1",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.2.1.tgz",
+      "integrity": "sha512-z716cpm5TX4uzOzILx8PavOE6C6DKshHDw1aQN52M/yNSqE9s5O8SMfyhCCfCJ3HmTL0NkVOi+8a/55T7YB3bg==",
       "dev": true
     },
     "ajv": {
@@ -12480,9 +12491,9 @@
       }
     },
     "is-core-module": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.2.0.tgz",
-      "integrity": "sha512-XRAfAdyyY5F5cOXn7hYQDqh2Xmii+DEfIcQGxK/uNwMHhIkPWO0g8msXcbzLe+MpGoR951MlqM/2iIlU4vKDdQ==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.3.0.tgz",
+      "integrity": "sha512-xSphU2KG9867tsYdLD4RWQ1VqdFl4HTO9Thf3I/3dLEfr0dbPTWKsuCKrgqMljg4nPE+Gq0VCnzT3gr0CyBmsw==",
       "dev": true,
       "requires": {
         "has": "^1.0.3"
@@ -12617,6 +12628,7 @@
         "react": "^16.13.1",
         "react-dom": "^16.13.1",
         "react-emoji-render": "^1.2.4",
+        "react-fetch-hook": "^1.8.5",
         "react-refresh": "^0.10.0",
         "react-router-dom": "^5.2.0",
         "react-sound": "^1.2.0",
@@ -13957,6 +13969,13 @@
         }
       }
     },
+    "react-fetch-hook": {
+      "version": "1.8.5",
+      "resolved": "https://registry.npmjs.org/react-fetch-hook/-/react-fetch-hook-1.8.5.tgz",
+      "integrity": "sha512-HRkfFAGGS6u3xknFWvgNQBUBRkM0ZZnUlyv4yVy2e+ZijUDOPJ+CwgpZ5nvrNd6QVU8++KcV/9WSe3TyW/N/rA==",
+      "dev": true,
+      "requires": {}
+    },
     "react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
@@ -14990,9 +15009,9 @@
       }
     },
     "webpack": {
-      "version": "5.35.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.35.0.tgz",
-      "integrity": "sha512-au3gu55yYF/h6NXFr0KZPZAYxS6Nlc595BzYPke8n0CSff5WXcoixtjh5LC/8mXunkRKxhymhXmBY0+kEbR6jg==",
+      "version": "5.35.1",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.35.1.tgz",
+      "integrity": "sha512-uWKYStqJ23+N6/EnMEwUjPSSKUG1tFmcuKhALEh/QXoUxwN8eb3ATNIZB38A+fO6QZ0xfc7Cu7KNV9LXNhDCsw==",
       "dev": true,
       "requires": {
         "@types/eslint-scope": "^3.7.0",
diff --git a/routes/jami.js b/routes/jami.js
index 156e640..d76462e 100644
--- a/routes/jami.js
+++ b/routes/jami.js
@@ -10,7 +10,7 @@
         //router.use(express.json());
 
         // Accounts
-        router.get(['/accounts'], async (req, res, next) => {
+        router.get('/accounts', async (req, res) => {
             console.log("Get account list")
             let accounts = this.jami.getAccountList()
             if (req.user.accountFilter)
@@ -18,6 +18,24 @@
             res.json(await Promise.all(accounts.map(async account => await account.getSummary())))
         })
 
+        const checkCanCreateAccounts = (req, res, next) => {
+            console.log(`checkCanCreateAccounts ${req.params.accountId} for ${req.user.id}`)
+            if (req.user && !req.user.accountFilter) {
+                return next();
+            }
+            res.status(403).end()
+        }
+
+        router.post('/accounts', checkCanCreateAccounts, async (req, res) => {
+            console.log("Create new account")
+            console.log(req.body)
+            try {
+                res.json({ accountId: await this.jami.addAccount(req.body) })
+            } catch (e) {
+                res.status(400).json({ error: e })
+            }
+        })
+
         const checkAccount = (req, res, next) => {
             console.log(`checkAccount ${req.params.accountId} for ${req.user.id}`)
             if (req.user && (!req.user.accountFilter || req.user.accountFilter(req.params.accountId))) {
@@ -134,37 +152,39 @@
 
         // Nameserver
         const nsRouter = Router({mergeParams: true})
-        accountRouter.use('/ns', nsRouter)
+        accountRouter.use('/ns', nsRouter) // use account nameserver
+        router.use('/ns', nsRouter) // use default nameserver
 
         nsRouter.get(['/name/:nameQuery'], (req, res, next) => {
             console.log(`Name lookup ${req.params.nameQuery}`)
-            this.jami.lookupName(req.params.accountId, req.params.nameQuery)
+            this.jami.lookupName(req.params.accountId || '', req.params.nameQuery)
                 .then(result => {
                     if (result.state == 0)
                         res.json(result)
                     else if (result.state == 1)
-                        res.sendStatus(400)
+                        res.status(400).json({})
                     else
-                        res.sendStatus(404)
+                        res.status(404).json({})
                 }).catch(e => {
-                    res.sendStatus(404)
+                    res.status(404).json({})
                 })
         })
         nsRouter.get(['/addr/:addrQuery'], (req, res, next) => {
             console.log(`Address lookup ${req.params.addrQuery}`)
-            this.jami.lookupAddress(req.params.accountId, req.params.addrQuery)
+            this.jami.lookupAddress(req.params.accountId || '', req.params.addrQuery)
                 .then(result => {
                     if (result.state == 0)
                         res.json(result)
                     else if (result.state == 1)
-                        res.sendStatus(400)
+                        res.status(400).json({})
                     else
-                        res.sendStatus(404)
+                        res.status(404).json({})
                 }).catch(e => {
-                    res.sendStatus(404)
+                    res.status(404).json({})
                 })
         })
 
+
         return router
     }
 }