Skip to main content

How to create a new ____ ?

}List of elements in the app which might be needed to be added more of later on, write here only if there are few steps, else create a new page for it.

Auth method

  • create a new script in src\core\auth and create an object with AuthMethod type
  • inside AuthMethods in src\core\auth\utils.tsx add a key (should be the same supbase expects provider provider to be) for your auth method, and its value should be the AuthMethod type object you created.
  • create a button in src\screens\login\index.tsx along side the other auth buttons we have right now, call signIn function with your key in onPress

Tab

  • create a new key/value in TabsInfo, you will need an icon, a screen or navigator component to show, and a label for tab
  • add the screen component you want to show in TabType in src\screens or Navigator component in src\navigation

New Icons

  1. duplicate a file in src\ui\icons and rename the file and component accordingly.
  2. go to svg repo, search and select the icon you want to use. (The current collection being used is Solar Bold Icons.
  3. select the icon you want and click on the icon to open it's page.
  4. Click on edit vector, edit the icon as per your liking and copy svg.
  5. Open svgr playground and paste your svg xml here.
  6. Make sure to tick on react native and typescript from the left bar.
  7. copy the svg from the right window and replace it with the existing svg component in your created file. Do remember to copy all the dependencies of react native svg as well.
  8. Modify the component as needed.

Make a new icon / make more edits to existing icons.

  1. Download and install inkscape.
  2. Download the icon from step 2 of new icons as svg file.
  3. Create a new document of inkscape and import svg file, edit the file.
  4. Export the file as svg.
  5. Open the svg file, copy the xml and continue from step 5 of new icons.