netlify-templates / kpop-stack Goto Github PK

I've enabled RLS on my two tables profiles and parks (parks is your notes table, just renamed) but I cannot get it working. When creating a park I get this. I've tried a bunch of different policies but always get the same error.

Added these polices for parks. Im using profile_id as thats the auth id.

If I remove RLS and policies I can create/update/delete parks. So that codes fine.

I've tried logging the session here and it returns null.

I also tried copying a curl command from the api docs and that also returned the same error. Im guessing this one failed as its missing the user_id that I added in my policy
{"code":"42501","details":null,"hint":null,"message":"new row violates row-level security policy for table \"parks\""}

Description

Currently, with the Netlify template, we're always running netlify dev during development. This works and the Remix app runs in Netlify functions, but when a developer makes changes there is no hot reloading. They are required to do a browser refresh of the page to see the changes they made.

I discussed this internally as this causes confusion for developers that come to expect hot reloading. The proposed change will be to change the npm dev script to run remix dev so that a developer can build their app and get all the hot reloading goodness that the Remix dev server provides.

When they want to test the serverless version, they can run netlify dev with the above mentioned caveat about hot reloading.

Related discussion for the Netlify Remix template, remix-run/remix#3753

I was running through the flow with the "Deploy to Netlify" button on a Windows computer in WSL and after getting the Supabase environment variable setup I ran into a tailwind error running it locally. I was streaming on Twitch, so here is the timestamp where it happened and here are the changes I made to fix it. I did also install prisma, prisma client, and ts-node on this commit as well.

It was complaining that it could not resolve this import import tailwindStylesheetUrl from "./styles/tailwind.css";. But, as you can see in the video it was there.

I tried running another site I had setup the same way on a Macbook today and did not run into the same issues. From what I saw in the error everything appeared to be correctly linked, so I'm not sure if this is an issue that even needs to be resolved, but I wanted to bring it to your attention in case anyone else experiences it.

All three env vars are filled out correctly - how can I see which line this corresponds to?

    at action5 (/var/task/.netlify/functions-internal/server.js:747:18)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at Object.callRouteAction (/var/task/node_modules/@remix-run/server-runtime/data.js:40:14)
    at handleDataRequest (/var/task/node_modules/@remix-run/server-runtime/server.js:94:18)
    at requestHandler (/var/task/node_modules/@remix-run/server-runtime/server.js:34:18)
    at Runtime.handler (/var/task/node_modules/@remix-run/netlify/server.js:36:20)```

This database should have two tables:

• Notes
• Users

A user can have many notes. A note can only belong with one user.

We can also follow through some of the migration information that is found within a few other stacks to keep them connected. Example

remove unused testing tools icons

Follow along the examples of the other stacks like Grunge Stack

• add documentation for adding supabase url and anon key in .env file and/or netlify env vars

• finalize testing process and what to document

Updated list of things we'd like to see in our README:

• Installing Netlify CLI at the Development stage
• Signing up for Supabase and getting your environment variables from their site
• Adding a bit about installing Netlify CLI globally

Summary

Once the database is established with #3. We should be more more than ready to have the client they use to provide ways of logging in. If we managed to understand how to add persistence directly in this issue, totes fine!

Relevant documentation

Supabase - JavaScript Client - Auth Sigin

Summary

We should make sure to add this to our Netlify Template team organization. This will allow for us to have deploy previews we can reference along the way.

Summary

As a user with an account, I should be able to provide my credentials and be logged into the app. This page will need email and password.

As a user who puts in the wrong credentials, I should be informed that the user email and password combination may be incorrect. Informing both are incorrect is good security hygiene.

I tried to upgrade to React 18 with hydrateRoot and got a few errors:

Uncaught Error: Hydration failed because the initial UI does not match what was rendered on the server
Error: Hydration failed because the initial UI does not match what was rendered on the server.
Uncaught Error: There was an error while hydrating. Because the error happened outside of a Suspense boundary, the entire root will switch to client rendering.

Hi @tzmanics,

I'm receiving this error:

🚨 The template could not be verified because you do are not authorized to access that repository. Please double check the access rights of the repo or consider passing a --token

Why I need a token on a public repo?
For sure I can use the Deploy to Netlify button, but it's just to understand...

Summary

To make sure that our project stays up to date we'd like to add some tools:

• Cypress integration (for testing e2e, ref doc here)
• Renovate (for dependency management)
  add 'renovate.json` to project root

  {
    "$schema": "https://docs.renovatebot.com/renovate-schema.json",
    "extends": [
      "local>netlify-templates/renovate-config"
    ]
  }
  

• Disable dependabot secutrity and version update alerts
• Make sure to update the README on how to remove everything
  • add section on cypress removal
  • add section on removing renovate json file
  • add comment at top of renovate json saying it can be removed if not using renovate

Summary

While #3 allows us to have a database for our project, we will want to be certain to make it easy for others to get their own database up and running. This is where a tool like Prisma could be useful! I don't think it is necessary and could be an additional hurdle to implement with it but something to consider.

As a user when I run the initialization script (remix.init/index.js) I expect my project to scaffold a database with a user table and a notes table.

Hhh

Really enjoying this stack so far! I'm running into issues trying to get RLS to work. It looks like my problem is the same as that described here. (I'm creating a new issue because the other issue's creator closed it.)

I'm just trying to add a requirement that the authorized user be the owner of an item. But even if I just try to add a generic "open to everyone" policy, I get the same error. If I disable RLS, everything works fine.

I'm brand new to Remix and Supabase so I'm not sure yet what might be the issue. It seems like this is possibly an issue with this particular stack, and it'd be lovely to get it fixed not just for me but for all those who follow. 😄

Summary

We already eslint installed and a configuration from the Remix folks by default. We need to just make sure to build a command that allows us to make sure we're performing our linting.

I don't think we should auto perform it like with Husky or anything but I'm open to thoughts if we think that would be beneficial to folks!

Summary

When the user selects a particular note from the sidebar list, they should be to see the title and body text. They should not be able to edit that note. But they can delete that note.

Ran into an issue with the initial npm i

npm ERR! code 1
npm ERR! path /Users/thom/Sites/mike/fishwerwoods.com/node_modules/puppeteer
npm ERR! command failed
npm ERR! command sh -c node install.js
npm ERR! The chromium binary is not available for arm64.
npm ERR! If you are on Ubuntu, you can install with:
npm ERR!
npm ERR!  sudo apt install chromium
npm ERR!
npm ERR!
npm ERR!  sudo apt install chromium-browser
npm ERR!
npm ERR! /Users/thom/Sites/mike/fishwerwoods.com/node_modules/puppeteer/lib/cjs/puppeteer/node/BrowserFetcher.js:115
npm ERR!                     throw new Error();
npm ERR!                     ^
npm ERR!
npm ERR! Error
npm ERR!     at /Users/thom/Sites/mike/fishwerwoods.com/node_modules/puppeteer/lib/cjs/puppeteer/node/BrowserFetcher.js:115:27
npm ERR!     at FSReqCallback.oncomplete (node:fs:198:21)
npm ERR!
npm ERR! Node.js v17.8.0

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/thom/.npm/_logs/2022-09-14T03_22_56_676Z-debug-0.log

I was able to resolve the issue following this posts guidance.
https://linguinecode.com/post/how-to-fix-m1-mac-puppeteer-chromium-arm64-bug

via @kentcdodds

Would be good to put some mention of the steps you need to complete in the log of the remix.init script so people know they can't just run the build/dev but they need to set some environment variables and things first.

I think we should use something like:

• Jest
• Cypress
• React Testing Library

As far as things installed, but I am not 100% certain if we should put examples of everything there. That feels like it might be a lot of things to remove if we make them eject tests.

Hi there, thanks for your work on this template!

With a fresh local install of the stack, after installing deps, adding env variables (in Netlify admin), and running netlify deploy --prod results in this error:

https://keen-cendol-1585a7.netlify.app/

May 30, 04:49:21 PM: 39205aa9 2023-05-30T20:49:22.552Z undefined ERROR Uncaught Exception {"errorType":"Runtime.HandlerNotFound","errorMessage":"server.handler is undefined or not exported","stack":["Runtime.HandlerNotFound: server.handler is undefined or not exported"," at Object.UserFunction.js.module.exports.load (file:///var/runtime/index.mjs:1035:15)"," at start (file:///var/runtime/index.mjs:1195:23)"," at file:///var/runtime/index.mjs:1201:1"]}

On the other hand, using it as a template via the "Deploy to Netlify" link, works as expected:

https://jocular-dieffenbachia-382f45.netlify.app/

Any ideas?

There are lot of npm scripts, but no documentation of the different ones.
Which one should I add to the Netlify settings:

Summary

When the user navigates to /notes they should see a list of their current notes. If they have no notes, we should put a fun message there that lets them know they have no notes and should create one!

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Awaiting Schedule

These updates are awaiting their schedule. Click on a checkbox to get an update now.

• chore(deps): update dependency @types/react to v18.2.79
• chore(deps): update dependency prettier-plugin-tailwindcss to v0.5.14
• fix(deps): update dependency @supabase/supabase-js to v2.42.4
• chore(deps): update remix monorepo to v2.8.1 (@remix-run/dev, @remix-run/eslint-config, @remix-run/node, @remix-run/react, @remix-run/serve)
• chore(deps): update dependency eslint to v9
• chore(deps): update dependency npm-run-all2 to v6
• fix(deps): update dependency sort-package-json to v2

Detected dependencies

• Check this box to trigger a request for Renovate to run again on this repository

Summary

As a user, I should be able to sign up to the application. This will ask the user to provide an email and a password.

We can utilize any of the other stacks to get insights https://github.com/remix-run/blues-stack/blob/main/app/routes/join.tsx

I love the idea of this template. Deployment on netlify and integration with supabase worked like a charm, but I can't get the dev environment to work.

After following all the steps in the readme (creating the project with the "deploy to netlify" button), running "npm run dev" only gives me "Function not found..." in http://localhost:3000/

Logs look like this:

I havent changed any files, the only generated file is the .netlify/state.json

If I run npm run build it creates files in public/build and .netlify/functions-internal/server.js.
If I then run npm run dev, it serves the site correctly but after changing files it doesn't reflect those changes but apparently still serves the files generated in npm run build.

Summary

When the user fills out a form, we want to make sure to give them the right feedback about whether or not something worked. Instead of doing this in #11. I think making it its own thing could be valuable to see as its own PR and would also make it a bit easier if we do that along side of something like the Login page (#12) since they would be reusing a lot of the same elements.

I can't make it work too. What am I missing here?

node --version: v18.1.0

Running: npm run dev

Getting this issue when creating a user:

Originally posted by @leofmoura in #49 (comment)

As a user there are a lot of steps to setting up the project before you can fully get it operational currently:

• You need to go to Supabase and create a project
• You need to get the environment variable keys
• You need to set a session secret
• You need to run the SQL commands for establishing the schema
• You need to run the SQL commands for establishing the Postgres trigger functions
• You need to deploy the project

Previously back when we implemented login (#23), we used Supabase's auth system. It might make more sense to use Supabase to do the database but we roll the auth work ourselves. The big reason why we didn't do it before is that there were some complications with how Prisma cross join schemas (supabase/supabase#1502) like the one you'd get from Supabase's auth.users which was our initial approach (#37).

Taking prior art into how other Remix Stacks implement auth, I think it is fair to say they have it figured out!

By taking this approach though we offer ourselves the opportunity to scaffold the entire database with Prisma, seed the database with ease, allow for different implementations of a database to come in for local development versus production, and reduce the number of environment variables and potential errors we can come across.

when I try to Sign up after deploy the app I got an error

Summary

Not certain what group or licensing we'd need to support for it but I definitely want to make this happen!

I followed the step by step instructions (I believe) and I am getting the following error when running netlify dev

Rebuilding...
Done in 274ms.
◈ Netlify Dev ◈
◈ Injected build setting env var: SUPABASE_URL
◈ Injected build setting env var: SUPABASE_ANON_KEY
◈ Injected build setting env var: SESSION_SECRET
◈ Overriding command with setting derived from netlify.toml [dev] block: remix watch
◈ No "targetPort" option specified or detected.
ERROR: "dev:remix" exited with 1.

What should I do to make this work?

Thanks

changing project name everywhere