studiointeract / accounts-ui Goto Github PK
View Code? Open in Web Editor NEWAccounts UI for React in Meteor 1.3+
License: MIT License
Accounts UI for React in Meteor 1.3+
License: MIT License
Customizing a theme based on this package...progress is good but can't seem to get the form error messages to show next to input fields.
I am using MDL. It looks something like:
<div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" id="sample2">
<label class="mdl-textfield__label" for="sample2">Number...</label>
<!-- render this on error -->
<span class="mdl-textfield__error">Input is not a number!</span>
</div>
Any hints on how this can be done or is this a feature request?
Looks like softwarerero:accounts-t9n
has a dependency on Blaze. Without it installed, I get this...
Uncaught ReferenceError: UI is not defined softwarerero_accounts-t9n.js?hash=96cfc39…:34
https://github.com/softwarerero/meteor-accounts-t9n/blob/master/package.js#L24
Hi after updating to the last version here and the last version of meteor it won't work at all
I cannot login or whatever
std:accounts-ui upgraded from 1.1.12 to 1.1.20
updated to Meteor 1.3.2.4.
Try it with a new install please :)
I am following the documentation to add extra fields (firstname and lastname). It renders the fields as expected, but when filling the form it shows the following error:
underscore.js:102 Uncaught (in promise) RangeError: Maximum call stack size exceeded(…)
Removing the extra fields it works fine.
Any idea was this is happening.
Can someone show a working example adding extra fields (maybe I am missing something)
I see that LoginForm has a SocialButtons element. How do I enable it so as to make it visible on the LoginForm?
What would be the steps to add support for other log in providers?
I have tried implementing the formState in React Router example from the docs: <Route path="/signup" component={ Accounts.ui.LoginForm } formState={ STATES.SIGN_UP } />
to no avail. If I place <Accounts.ui.LoginForm formState={ STATES.SIGN_UP } />
into its own component and instead call that component into the route, I can at least set the state when that route is entered, but I obviously cannot control the flow the opposite direction (if a user hits Sign In then they will see those form fields but the URL will not change).
Is there anyway to get the intended results from the original code sample? A friend has been able to implement it within Flow Router, so I might drift that direction but wanted to see if this was an issue in the community.
I think that we should add more error messages such as:
Are any hooks that can be used?
As you can see, some translations are missing when using meteor-accounts-t9n:
What's the best way to add them in? Make a PR to accounts-t9n? Or is there somewhere in this repo where I could translate them?
I notice that this package at version 1.1.17, when used with the latest tracker-component errors out as so by @jshimko here: studiointeract/tracker-component#6 (comment)
Could we get some clarification on if this is a bug, or if this now requires us to use your NPM Tracker package?
I'm dead in the water with accounts for the past 3 days, waiting for a response to my previous post here.
I need to install social buttons. Is that possible? The Read.me doesn't say how to do it. How is this done?
I also need documentation on how to modify the components. Do I overwrite the ones included in the package? Wouldn't my mods be deleted when the package is updated? Please explain how this is done or provide a link that discusses how this is done.
Been wrecking my head on figuring out how to make a Confirm Password field when Signing In and also Changing Password. Any help would be great.
Here's the stack trace. I'll try to investigate.
W20160330-23:33:15.732(2)? (STDERR) W20160330-23:33:15.732(2)? (STDERR) /Users/maz-dev/.meteor/packages/meteor-tool/.1.3.0_3.3ma3kz++os.osx.x86_64+web.browser+web.cordova/mt-os.osx.x86_64/dev_bundle/server-lib/node_modules/fibers/future.js:267 W20160330-23:33:15.732(2)? (STDERR) throw(ex); W20160330-23:33:15.732(2)? (STDERR) ^ W20160330-23:33:15.823(2)? (STDERR) TypeError: Cannot set property 'loginNoPassword' of undefined W20160330-23:33:15.823(2)? (STDERR) at meteorInstall.node_modules.meteor.studiointeract:react-accounts-ui.imports.api.server.loginWithoutPassword.js (packages/studiointeract:react-accounts-ui/imports/api/server/loginWithoutPassword.js:87:1) W20160330-23:33:15.823(2)? (STDERR) at fileEvaluate (packages/modules-runtime.js:158:9) W20160330-23:33:15.823(2)? (STDERR) at require (packages/modules-runtime.js:92:16) W20160330-23:33:15.824(2)? (STDERR) at meteorInstall.node_modules.meteor.studiointeract:react-accounts-ui.main_server.js (packages/studiointeract:react-accounts-ui/main_server.js:5:1) W20160330-23:33:15.824(2)? (STDERR) at fileEvaluate (packages/modules-runtime.js:158:9) W20160330-23:33:15.824(2)? (STDERR) at require (packages/modules-runtime.js:92:16) W20160330-23:33:15.825(2)? (STDERR) at /Users/maz-dev/code/saintejs/.meteor/local/build/programs/server/packages/studiointeract_react-accounts-ui.js:24855:15 W20160330-23:33:15.825(2)? (STDERR) at /Users/maz-dev/code/saintejs/.meteor/local/build/programs/server/packages/studiointeract_react-accounts-ui.js:24861:3 W20160330-23:33:15.826(2)? (STDERR) at /Users/maz-dev/code/saintejs/.meteor/local/build/programs/server/boot.js:283:10 W20160330-23:33:15.826(2)? (STDERR) at Array.forEach (native)
The current default functions for onResetPasswordHook and onEnrollAccountHook redirect the form to the loginPath, which then changes the formState from PASSWORD_CHANGE to SIGN_IN and does not show the correct change password form.
In my project I set these hooks to blank functions to make these functions work, but this seems like a bad default.
I keep getting "Signups forbidden", even with
forbidClientAccountCreation: false
I did a meteor reset a few times...please advise
Hi great work you did already.
What I am missing is a way to ask user for firstname, lastname, etc... during signup and store these values in his profile.
I already figured out how to add the appropriate fields in the signup form like this
class NewLogin extends Accounts.ui.LoginForm {
fields() {
const { formState } = this.state;
if (formState == STATES.SIGN_UP) {
return {
firstname: {
id: 'firstname',
hint: 'Enter firstname',
label: 'firstname',
onChange: this.handleChange.bind(this, 'firstname')
},
...super.fields()
};
}
return super.fields();
}
}
But i cannot figure out how to get them into the options Object when calling the createUser method in line 451 of the LoginForm
Accounts.createUser(options, (error) => {
Can you give advice on it if possible at all or add a possibility for it.
Thx in advance
If services packages are present but not configured, we should have a form allowing us to configure them.
Hey there,
I noticed that once the LoginForm component is constructed nothing happens when the formState property is changed, through e.g. something like this:
FlowRouter.route('/login', {
name: 'users.login',
action() {
mount(MainLayoutCtx, {
content: () => (<Accounts.ui.LoginForm {...{
formState: STATES.SIGN_IN,
signUpPath: '/signup',
}} />),
});
},
});
So when your app has two links in the navbar, one to the signup and one to the login form, the user cannot switch between the two forms using these links.
I think it's simple to fix and will provide a pull request shortly..
when trying to log in (pressing sign in button or hitting enter) a page reload is made with the same url but a "?" is added. This happens on any page including the LoginForm.
I tried commenting out all customized configuration
import { Accounts } from 'meteor/std:accounts-ui';
export default function () {
Accounts.ui.config({
passwordSignupFields: 'USERNAME_AND_EMAIL',
// loginPath: '/login',
// signUpPath: '/register',
// resetPasswordPath: '/reset-password',
// profilePath: '/profile',
// onSignedInHook: () => FlowRouter.go('/dashboard'),
// onSignedOutHook: () => FlowRouter.go('/'),
// minimumPasswordLength: 6
});
}
using default Accounts.ui.LoginForm but it does not help.
The problems started in 1.1.4
I have gone back to version 1.1.0
:-(
For some reason (I think Google is changing the scope declaration pattern), the latest version of the google-accounts package has a dependency that no longer pulls email from a Google oAuth. I tried to expand the scope with the follow but it does not seem to pick up those values.
Accounts.ui.config({
requestPermissions: {
google: [
'https://www.googleapis.com/auth/userinfo.profile',
'https://www.googleapis.com/auth/userinfo.email',
]
}
});
In the meantime I have able to just create my own button that triggers the following, but I imagine there is a cleaner fix. Any ideas?
handleGoogleClick(event) {
event.preventDefault();
Meteor.loginWithGoogle({
requestPermissions: ['email']
}, function (err) {
if (!err) {
const userId = Meteor.userId();
}
});
}
Here:
https://github.com/studiointeract/react-accounts-ui/blob/master/imports/ui/components/Field.jsx#L10
Uncaught TypeError: Cannot read property 'getElementsByTagName' of null
If I resize the window, the component loses it's state, which leads to not rendering anything.
Is anybody experiencing the same?
I am experimenting inconsistencies, when I try to set the path to certain states i.e. signUpPath = '/register'
corresponds to STATES.SIGN_UP
and loginPath='/login'
corresponds to STATES.SIGN_IN
.
e.g. when I am in /password-reset
and click to Sign In
which redirects me to /login
the state for the form is STATES.SIGN_UP
instead of STATES.SIGN_IN
.
Anyone experimenting the same?
The app will crash if go to any accounts relation routers when the user already logged in,
like /login, /signup, /reset-password, /profile.
I found in LoginForm.jsx is using (user && formState == STATES.PROFILE && (user && 'password' in user.services))
to add changePassword button,
But the app will crach in the user.services
is undefined.
LoginForm.jsx:287 Uncaught TypeError: Cannot use 'in' operator to search for 'password' in undefined
In the Meteor guild, the user services field will not auto send to client,
is it correct using user.services
is client side?
Looks like this particular hook is breaking the package. If you try to add it in your config:
Accounts.ui.config({
passwordSignupFields: 'EMAIL_ONLY',
loginPath: '/',
onSignedInHook: () => FlowRouter.go('/dashboard'),
onSignedOutHook: () => FlowRouter.go('/'),
preSignUpHook: () => { console.log('hello') }
});
You get an error of:
Uncaught Error: Accounts.ui.config: Invalid key: preSignUpHook
If you take it out:
Accounts.ui.config({
passwordSignupFields: 'EMAIL_ONLY',
loginPath: '/',
onSignedInHook: () => FlowRouter.go('/dashboard'),
onSignedOutHook: () => FlowRouter.go('/'),
// preSignUpHook: () => { console.log('hello') }
});
You get an error of:
Uncaught TypeError: _accountsBase.Accounts.ui._options.preSignUpHook is not a function
When only using 3rd party services, there are few things that could be improved. e.g.:
Forget Password Button
Login / Register Buttons
For some reason, I can’t seem to finish the installation. When I enter “meteor add std:accounts-ui” it downloads and loads various things, but it gets stuck at this point: “Extracting std:[email protected]...”
Any idea about what I’m doing wrong, or how I can fix it?
The machine is running Windows 7.
Hi. I try to make a theme for https://github.com/callemall/material-ui but i don't understand your instructions.
Do you have some examples for the changes? I don't understand your instructions (I'm a newbie in javascript).
Thanks and congratulations for your plugin
Hi,
With the latest version, I cannot get resetPasswordPath
, nor onResetPasswordHook
to have any effect.
The link just redirects to localhost:3000 in development where nothings happens. Only when I manually go to '/login' by clicking my own login-link, do I see that form has a reset-password state.
Please advise. :)
I installed accounts-ui using these commands:
npm i --save react react-dom react-router
meteor add accounts-password
meteor add std:accounts-ui
npm i --save tracker-component
On running, the console shows the following errors:
Uncaught Error: Cannot find module 'tracker-component/package.json'
Uncaught Error: Cannot find module 'meteor/std:accounts-ui'
What am I missing?
I see this helpful message in the console:
Accounts.config was called on the client but not on the server; some configuration options may not take effect.
Where is the correct place for me to set up Accounts.config on the server? I'm using Mantra.
When you use package.json with dependencies we have two copies of all your packages (one is my plus one is your). It's very bad!
It's crazy, but you use package.json for add of your sub-packages (bootstrap, etc.). Then we have three(!) copies of react, three copies of react-dom and three copies of tracker-component!
I'm getting:
Unable to resolve some modules:
"tracker-component" in /Users/sacha/Dev/packages/react-accounts-ui/imports/ui/components/LoginForm.jsx (os.osx.x86_64)
Consider running: meteor npm install --save tracker-component
But installing tracker-component
then gives me:
npm ERR! notarget No compatible version found: react@'>=15.0.0 <16.0.0'
npm ERR! notarget Valid install targets:
npm ERR! notarget ["0.10.0-rc1","0.11.0-rc1","0.0.1","0.0.2","0.0.3","0.1.2","0.2.0","0.2.1","0.2.2","0.2.3","0.2.4","0.2.5","0.2.6","0.3.0","0.3.4","0.3.5","0.5.0","0.5.1","0.5.2","0.6.0","0.6.1","0.6.2","0.6.3","0.7.0","0.7.1","0.8.0","0.9.0-rc1","0.9.0","0.10.0-rc1","0.10.0","0.11.0-rc1","0.11.0","0.11.1","0.11.2","0.12.0-rc1","0.12.0","0.12.1","0.12.2","0.13.0-alpha.1","0.13.0-alpha.2","0.13.0-beta.1","0.13.0-beta.2","0.13.0-rc1","0.13.0-rc2","0.13.0","0.13.1","0.13.2","0.13.3","0.14.0-alpha1","0.14.0-alpha2","0.14.0-alpha3","0.14.0-beta1","0.14.0-beta2","0.14.0-beta3","0.14.0-rc1","0.14.0","0.14.1","0.14.2","0.14.3","0.14.4","0.14.5","0.14.6","0.15.0-alpha.1","0.14.7","15.0.0-rc.1","15.0.0-rc.2"]
Does this package depend on React 15? It won't work with previous versions?
I feel like this name might conflict with https://atmospherejs.com/alt/react-accounts-ui
Since this hasn't been published to Atmosphere yet, maybe you could change the name? Or else, maybe merge both projects somehow?
"Forgot Password" link still appears even with accounts-password disabled.
I've successfully gotten the elements to render on the page, but none of the buttons work. Upon entering a valid email address, I am able to at least switch between signin/signup/forgot, but I can never submit any of these forms.
I have had this problems on a few build outs, including trying to run superlumen's base system. A friend of mine had the forms working in one repository, but I could not get that same repository to run on my system. Similarly, superlumen's build had the same error on my friend's computer. We were not able to see any obvious environment differences.
This is on Meteor 1.3.4.1.
Since I updated from 1.1.13 to 1.1.15 (and meteor to 1.3.1), the tmeasday:check-npm-versions
package was added.
updated to Meteor 1.3.1.
Changes to your project's package version selections from updating package
versions:
std:accounts-basic upgraded from 1.1.8 to 1.1.9
std:accounts-ui upgraded from 1.1.13 to 1.1.15
tmeasday:check-npm-versions added, version 0.1.1
And an error appeared to my console browser:
Uncaught Error: tracker-component@^1.3.13 not installed.
The package is actually installed in node_modules
. Is this a tmeasday:check-npm-versions
or meteor 1.3.1 bug?
When I start filling the fields in the loginForm
in Sign In
state, but then I realise that I am creating a new user, hence I change to Sign Up
state, when I submit the form, for some reason it is not working.
See: http://recordit.co/prX8u4YmWI
I don't know how to classify this, but I guess is a bug as it is a behaviour that I would expect.
Hi in the meteor docs
Accounts.ui.config is for client side
and
Accounts.onCreateUser for server side
I do not understand how or why are you mixing them with the postSignUpHook and think this is the cause why my app broke after upgrading to accounts-ui 1.1.5
I get the error
W20160402-23:59:43.756(2)? (STDERR) Error: Can only call onCreateUser once
W20160402-23:59:43.772(2)? (STDERR) at AccountsServer.onCreateUser (packages/accounts-base/accounts_server.js:120:13)
W20160402-23:59:43.772(2)? (STDERR) at exports.default (server/configs/accounts_setup.js:5:12)
W20160402-23:59:43.772(2)? (STDERR) at meteorInstall.server.main.js (server/main.js:6:1)
...
You can only have a single callback hook on Accounts.onCreateUser
, which leads to the following warning:
You've implemented Accounts.onCreateUser elsewhere in your application, you can therefor not use Accounts.ui.config({ onPostSignUpHook }) on the server.
What if instead of showing that warning, accounts-ui
simply extended the current callback (available at Accounts._onCreateUserHook
) with its own custom logic?
i.e.
Accounts.onCreateUser(() => {
Accounts._onCreateUserHook();
// do custom stuff here
}
Hi, I am using this in the mantra-sample-app.
And when writing a test for it i get the error:
Error: Cannot find module 'meteor/std-accounts-ui
at Function.Module._resolveFilename (module.js:339:15)
at Function.Module._load (module.js:290:25)
at Module.require (module.js:367:17)
at require (internal/module.js:16:19)
...
The app works fine. I did run the command meteor add std-accounts-ui
So my guess is the unit testing (mocha) has problems with atmosphere packages and i would like to test it with npm package instead.
NO_PASSWORD is not a valid option according to your documentation yet examples use it and say it is the default.
Earlier in documentation (near top) it states that EMAIL_ONLY_NO_PASSWORD is the default.
and in code:
if (options.passwordSignupFields) {
if (_.contains([
"USERNAME_AND_EMAIL",
"USERNAME_AND_OPTIONAL_EMAIL",
"USERNAME_ONLY",
"EMAIL_ONLY",
"EMAIL_ONLY_NO_PASSWORD",
"USERNAME_AND_EMAIL_NO_PASSWORD"
],
Hello,
Using latest version as of now.
Steps to reproduce:
Changing the already set email-field makes it work again.
But this is no solution.
What to do? :)
I am implementing an invitation system.
Are the current hooks in this package enough?
Basically I'll have to send a token, that will need to be validated, before creating the user.
After that the that user will need to be assigned to a specific role.
@SachaG and @timbrandin what do you think?
the State for Accounts.ui.LoginForm is being set to PROFILE even when the formState prop is specified.
I wanted to have a route to show the Change Password form, so I specified a route as such:
FlowRouter.route('/change-password', {
name: 'users.changePassword',
action() {
mount(MainLayoutCtx, {
content: () => (<Accounts.ui.LoginForm {...{formState: STATES.PASSWORD_CHANGE}} />),
h1: "Change Password"
});
}
});
But because of this line, the state is being forced to PROFILE:
https://github.com/studiointeract/accounts-ui/blob/master/imports/ui/components/LoginForm.jsx#L33
It needs to be modified to have a default state of SIGN_IN when not signed in, and PROFILE when signed in, but use a specified formState prop if passed in. I will create a PR and link to this issue.
China
zh_cn.js
T9n.map('zh_cn', {
cancel: '取消',
'Enter password': '输入密码',
'Enter newPassword': '输入新密码',
'Enter email': '输入电子邮箱',
'Enter username': '输入用户名',
'Enter username or email': '输入用户名或电子邮箱',
error: {
accounts: {
'Invalid email or username': '无效的密码或用户名',
'Internal server error': '内部服务器错误',
'undefined': '服务未配置',
},
},
'or use': '或是使用',
});
Hi Tim,
I get Invalid email for email like [email protected] and it's not working at all in the last version of meteor
thanks for any help.
Taiwan
zh_tw.js
T9n.map('zh_tw', {
cancel: '取消',
'Enter password': '輸入密碼',
'Enter newPassword': '輸入新密碼',
'Enter email': '數入電子郵箱',
'Enter username': '輸入用戶名',
'Enter username or email': '輸入用戶名或電子郵箱',
error: {
accounts: {
'Invalid email or username': '無效的密碼或用戶名',
'Internal server error': '內部服務器錯誤',
'undefined': '服務未配置',
},
},
'or use': '或是使用',
});
If parameter 'address' is set email's 'to'-address will not be set:
'To' is set with variable 'email':
var options = { to: email, from: Accounts.em
But 'email' is only set when address is not set:
if (!address) { var email = _.find(user.emails || [], function (e) { return !e.verified; }); address = (email || {}).address; }
This case happens when configuring 'EMAIL_ONLY_NO_PASSWORD':
Accounts.ui.config({ passwordSignupFields: 'EMAIL_ONLY_NO_PASSWORD', ...
Error: LoginForm.jsx:512 Uncaught TypeError: login is not a function
I guess that the bug is that the service is defined as meteor-developer
, but it needs to be MeteorDeveloperAccount
(ref: http://docs.meteor.com/#/full/meteor_loginwithexternalservice)
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.