KYAN1TE
KYAN1TE
PostsComments
WWasp-lang
Created by KYAN1TE on 1/7/2024 in #🙋questions
Disable case sensitivity on username register/login?
Brilliant, looking forward to it!
12 replies
WWasp-lang
Created by KYAN1TE on 1/7/2024 in #🙋questions
Disable case sensitivity on username register/login?
Yep I have done something similar to this, but I wouldn't say throwing an error if the username isn't lowercase is a great user experience! I'd much rather let the user have case insensitivity at both signup & login if it was username/password login for example
12 replies
WWasp-lang
Created by KYAN1TE on 1/7/2024 in #🙋questions
Disable case sensitivity on username register/login?
Yeah I ran in to this whilst switching over to email/password auth, but I still let my user maintain a username (e.g. think twitter login). Out of interest, will it be difficult to migrate from the current version to 0.12? I think the real long term solution to what I'm experiencing is the auth overhaul you mention.
12 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
No worries, thanks @martinsos !
14 replies
WWasp-lang
Created by Dayne on 12/23/2023 in #🙋questions
[SOLVED] Using Decimal type with Prisma
Just ran in to this issue, but with the intention of using Decimal to store latitude & longitude values. Not a big deal for my use case, however where precision is required, decimal would be preferred. Just noting this here as it seems the above has circumvented the lack of Decimal types with the whole money use case.
15 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
and something like this covers firefox: 
const defaultWaspFormFieldsToHide = ["username", "password"];

  useEffect(() => {
    const hideFirstFormField = (fieldName: string) => {
      const input = document.querySelector(
        `input[name="${fieldName}"]:not(#${fieldName})`
      ) as HTMLElement;
      if (input) {
        input.style.display = "none";

        const prevLabel = input.previousElementSibling as HTMLElement;
        if (prevLabel && prevLabel.tagName === "LABEL") {
          prevLabel.style.display = "none";
        }
      }
    };

    const defaultWaspFormTitle = document.querySelector('h2') as HTMLElement;
    defaultWaspFormTitle.style.display = 'none';
    defaultWaspFormFieldsToHide.map(hideFirstFormField);
  });
const defaultWaspFormFieldsToHide = ["username", "password"];

  useEffect(() => {
    const hideFirstFormField = (fieldName: string) => {
      const input = document.querySelector(
        `input[name="${fieldName}"]:not(#${fieldName})`
      ) as HTMLElement;
      if (input) {
        input.style.display = "none";

        const prevLabel = input.previousElementSibling as HTMLElement;
        if (prevLabel && prevLabel.tagName === "LABEL") {
          prevLabel.style.display = "none";
        }
      }
    };

    const defaultWaspFormTitle = document.querySelector('h2') as HTMLElement;
    defaultWaspFormTitle.style.display = 'none';
    defaultWaspFormFieldsToHide.map(hideFirstFormField);
  });
Let me know if there is a better way that doesn't rely on changes made to Wasp itself, thanks
14 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
I've rolled back the years to pretend I know how to write css & ended up applying this to my auth component lol: h2 { display: none; } div:has(> input[name="username"]:not(#username)) { display: none; } div:has(> input[name="password"]:not(#password)) { display: none; } Downside is that the has selector doesn't work on some modern versions of firefox, so I will continue having a play & this can be a workaround for now I guess until the out of box components have more customisation options 🤷‍♂️
14 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
Just had a look at the source code. Doesn't look like it'd be too much overhead to add some extra props to facilitate not displaying the title &/or the default inputs at first glance (I could be wrong). In fact, it looks like it'd take me longer to setup all the haskell stuff to run the project, than it would do for me to just do the react changes & submit a PR 😭
14 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
Hmmm, I've hit another wall 🤕 The appearance prop options seem to be limited (relative to my custom inputs that use tailwind for example) & I also cannot get rid of the text that says Create a new account for example using the wasp SignupForm. Is there a way around this?
14 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
Me again, I've just discovered https://wasp-lang.dev/docs/auth/overview#customizing-the-signup-process I don't know how I overlooked this, I think I'm okay now as I can just extend the existing wasp auth 👍 Will leave this open for the next day or two in case I run in to any more issues otherwise I'll most likely mark as solved
14 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
e.g. 
import { User } from "@wasp/entities";
import type { SignupUser } from "@wasp/actions/types";

type SignupPayload = Pick<
  User,
  "username" | "password" | "displayName"
>;

export const signUp: SignupUser<SignupPayload, User> = async (
  args,
  context
) => {
  const newUser = context.entities.User.create({
    data: {
      username: args.username,
      password: args.password,
      displayName: args.displayName
    },
  });

  return newUser;
};
import { User } from "@wasp/entities";
import type { SignupUser } from "@wasp/actions/types";

type SignupPayload = Pick<
  User,
  "username" | "password" | "displayName"
>;

export const signUp: SignupUser<SignupPayload, User> = async (
  args,
  context
) => {
  const newUser = context.entities.User.create({
    data: {
      username: args.username,
      password: args.password,
      displayName: args.displayName
    },
  });

  return newUser;
};
I'd much rather just be able to use the out of box wasp (last thing I really want to do is roll my own auth...) tbh if I can achieve what I want to achieve with it.
14 replies
WWasp-lang
Created by KYAN1TE on 12/26/2023 in #🙋questions
Custom auth error messages?
@Filip Thanks for the response! I have actually implemented a custom action as the docs you linked were what I was following. The issue is that the catch statement that sets the error on the UI, isn't very valuable when the error is something very generic such as Request failed with status code 500 to the user. Server side I get a PrismaClientKnownRequestError so there may be something fancier I can do in my catch statement. Edit: Unable to catch that error server side :/ In addition, not sure I'm a fan of an extra database query to check whether a user already exists with a username, particularly when it's already set as a unique constraint in the SQL database, if that was the suggestion? Edit: I take the above back, given that this seems to be what wasp does out of the box: https://github.com/wasp-lang/wasp/blob/994a58f0dc37744bc9f03830d7d0ca43066bb345/waspc/data/Generator/templates/server/src/auth/providers/email/signup.ts#L36 @miho As said above, in my preview tab, I simply see the PrismaClientKnownRequestError as part of my custom signup action. So I guess as long as I want to roll with a custom signup action where I'm using Prisma directly, I won't get any wasp magic for free, right? @Filip @miho Given the above, is it safe to say that my headaches are as a result of rolling a custom signup action? The reason I've gone down this approach is because I want my users to be able to also specify a display name upon signing up alongside some other preferences.
14 replies
WWasp-lang
Created by KYAN1TE on 12/18/2023 in #🙋questions
[SOLVED] Object relation works when running app but doesn't compile to TypeScript?
Thank you 🙂
14 replies
WWasp-lang
Created by KYAN1TE on 12/18/2023 in #🙋questions
[SOLVED] Object relation works when running app but doesn't compile to TypeScript?
Amazing, thank you so much @Filip! I look forward to option 2 but can live with having to use satisfies for now 👍
14 replies
WWasp-lang
Created by KYAN1TE on 12/18/2023 in #🙋questions
[SOLVED] Object relation works when running app but doesn't compile to TypeScript?
Another update, so the Fly deployment with the above supposed solution isn't functional: 
   "src/ext-src/components/Notepad/TaskComponent.tsx(7,34): error TS2307: Cannot find module '../../../server/types' or its corresponding type declarations.\n"
   "src/ext-src/components/Notepad/TaskComponent.tsx(7,34): error TS2307: Cannot find module '../../../server/types' or its corresponding type declarations.\n"
It's pretty self explanatory & understandable if it's trying to deploy client/server separately (unsure exactly how wasp is compiling then deploying under the hood) but as it's late, I'll not bother trying to solve (except the obvious of just having two separate types on server & client which has dedployed successfully) & just see what you suggest tomorrow morning 🙂 Thanks again
14 replies
WWasp-lang
Created by KYAN1TE on 12/18/2023 in #🙋questions
[SOLVED] Object relation works when running app but doesn't compile to TypeScript?
So I've fixed it by having a play. Created a types.ts in the server with: 
export type TaskWithCategory = Task & {
  category: Category;
};
export type TaskWithCategory = Task & {
  category: Category;
};
& then I just use that within my getAllUserTasksQuery without satisfies like so: 
export const getAllUserTasksQuery: GetAllUserTasksQuery<
  void,
  TaskWithCategory[]
> 
export const getAllUserTasksQuery: GetAllUserTasksQuery<
  void,
  TaskWithCategory[]
>
& then that lets me define my client props like so to avoid the error client side: 
interface TaskComponentProps {
  task: TaskWithCategory;
}
interface TaskComponentProps {
  task: TaskWithCategory;
}
Note that I'm a C# guy, not a TypeScript guy & I don't know much about wasp (yet) so I am all ears if there is a better/more maintainable way to do this. Thanks
14 replies
WWasp-lang
Created by KYAN1TE on 12/18/2023 in #🙋questions
[SOLVED] Object relation works when running app but doesn't compile to TypeScript?
Thanks for the response @Filip Unfortunately, I still getting an error on the client/JSX code for task.category.name despite applying your recommended changes to the getAllUserTasksQuery. I believe this is simply because despite the change on the server, my React component's prop expects a type Task (which by default doesn't contain the category object, only the id) & so my next question would be, in this case, how are we expected to match types between server & client in this case? Kind of feel like unless there is an obvious solution for this that I'm missing, that it makes it a bit difficult to pass queried data down as typed props & that there is an expectation to always query data in the component where it is required, which makes it difficult to build front-ends up as different reusable components 🤔 Thanks
14 replies
WWasp-lang
Created by KYAN1TE on 12/18/2023 in #🙋questions
[SOLVED] Object relation works when running app but doesn't compile to TypeScript?
No worries, here is the repo btw: https://github.com/karam94/WaspTodoApp
14 replies