# Simple Steps for Including Custom Fields in Wasp Google Auth

## The problem statement

When using Google OAuth in @[Wasp](@Wasp-Lang) project, you might notice that behind the scenes, whenever you are logging in the user, creates the user for you, if it doesn't exist. It does so with very minimal user fields, but what if you need additional user information, such as `profile image` or `full name`?

Let's take care of that and learn a thing or two about @[Wasp](@Wasp-Lang) lang.

## The solution

1. Make sure your database has the correct columns, in the User table. In my case, I added 2 more properties to the User entity, in my `main.wasp` file:
    

```pgsql
entity User {=psl
  id                        Int             @id @default(autoincrement())
  email                     String?          @unique
  password                  String?
  isEmailVerified           Boolean         @default(false)
  emailVerificationSentAt   DateTime?
  passwordResetSentAt       DateTime?
	profileImage							String?
	fullName									String?
  stripeId                  String? 
  checkoutSessionId         String?
  hasPaid                   Boolean         @default(false)
  sendEmail                 Boolean         @default(false)
  datePaid                  DateTime?
  credits                   Int             @default(3)
  relatedObject             RelatedObject[]
  externalAuthAssociations  SocialLogin[]
psl=}
```

Once added, run `wasp db migrate-dev` so @[Wasp](@Wasp-Lang) takes care of all the db migrations, and relaunch your server.

1. In `main.wasp` add a new dependency `@types/passport-google-oauth20`. At the time of writing this article, the actual version is `2.0.11` but go ahead and install the latest one.
    

```cpp
("@types/passport-google-oauth20", "2.0.11")
```

*The reason why you install* `@types/passport-google-oauth20` *is because @[Wasp](@Wasp-Lang) is using* `passport` *to handle authentication strategy etc behind the scenes, so that's exactly the types that are used in the backend and that you can expect to be returned.*

1. Create a file under `src/server/auth/google.ts`
    
2. Add new function `getUserFields` alongside with type import:
    

```typescript
import { Profile } from "passport-google-oauth20";

export async function getUserFields(
  _: unknown,
  args: { profile: Profile }
) {
  const userFields = {
    email: args.profile._json.email,
    profileImage: args.profile._json.picture,
    fullName: args.profile._json.name,
  };
  return userFields;
}
```

1. Declare your `getUserFields` function in `main.wasp` file, by adding `getUserFieldsFn` property to `auth.methods.google` object, like so:
    

```typescript
  auth: {
    userEntity: User,
    externalAuthEntity: SocialLogin,
    methods: {
      google: {
        getUserFieldsFn: import { getUserFields } from "@server/auth/google.js", // <-- add `getUserFieldsFn` property
        configFn: import { config } from "@server/auth/google.js",
      },
    },
    onAuthFailedRedirectTo: "/",
  },
```

[Function `getUserFields` is a special function](https://wasp-lang.dev/docs/language/features#getuserfieldsfn), that @[Wasp](@Wasp-Lang) is using to retrieve any user fields that will be added to the database. The second argument of this function is to receive an object, that contains `profile` of type `Profile` . This is what is being "passed" to you by @[Wasp](@Wasp-Lang) , so that you can "cherry-pick" what you want to be saved into your User record when one will be created.

Whatever object you will return from this function, this is what will be stored in the User table, under the new row. As you can see, I am retrieving `profileImage` and `fullName` properties from `args.profile._json.` object.

You can read more about `getUserFields` in the linked article, but it's only covering `JavaScript` file, not TypeScript, so hoping this article helps you to annotate. your codebase better, until @[Wasp](@Wasp-Lang) provides you with a type export by itself.

Follow me here on 📖 Hashnode: [https://blog.oleggulevskyy.dev/](https://blog.oleggulevskyy.dev/)

Follow me on 🐦 Twitter: [https://twitter.com/preacher\_rourke](https://twitter.com/preacher_rourke)

**I am sharing all the cool stuff I find, daily.**