xataio/xmdb

Xata Movie Database

Features ⚡️

• Typo-Tolerant Full-Text Search.
• Aggregations.
• Type-Safe SDK/ORM (schema-based types generation).
• Next.js App Directory with React Server Components.
• Intercepting Route
• Parallel Route

Stack ⚙️

Package	Reason
Zod	Schema validation
Xata Client	ORM
TailwindCSS	Styles
vercel/OG	OG image generation
React-Icons	SVG Icons as React components

Environment Setup 🧱

To have your own local instance of this app, you will need 2 API keys, and your deployment URL.

• XATA_API_TOKEN: to connect your own Xata workspace.
• VERCEL_URL: popullated by Vercel, on your local environment it’s your local server url (https://localhost:3000 by default).

Once you have those keys, you can create a .env.local as shown in .env.template.

Link to Xata 🦋

You can run the xata init command with some default configuration:

pnpm xata:link

By the end you should have the XATA_API_TOKEN in your .env.local and a .xatarc file created.

Database Seed 🌱

Once you have a working link with the workspace, you can run:

pnpm xata:seed

This task will add 100 rows of mocked data to get you started with a working app.

Run Locally 🧑‍✈️

Once you project is linked and database has data, you can start the development server.

pnpm dev

By default, server will run on localhost:3000.

---

xmdb's Issues

When clicking movies that don't have a poster the modal shows blank

When clicking movies that don't have a poster the modal shows blank:

Clear text input and pressing enter or clicking search should reset the results

How to reproduce the issue?

• Search for Schindler's List.
• Then delete all the text and press enter.
• The results should be reset but it is still showing the Schindler's List result instead.

Enhance design for rating

Rating the movie has some design problems, especially inside the modal. To fix this, we should enhance the design/animation for the rating functionality.

Enhancement Request: Make entire card area clickable

Currently, within our card layout, only the top part of each card is clickable. However, it is suggested that the entire card area should be clickable to enhance user interaction and convenience.

The proposed change aims to improve user experience by allowing users to click anywhere on the card to access its content or take action, rather than limiting interaction to only the top portion.

The "stars" (voting functionality) should only exist inside the modal. So they should be removed from the card.

Remove unnecessary star

The following "star" is unnecessary. On hover, they seem clickable but they're not doing anything so they should be removed.

Add better instructions on how to contribute to this repo

Better instructions

We need better instructions on how to contribute to this repo. The current instructions on README.md are missing some steps.

So I created one Google docs with new instructions that should be added to the README.md.

Sample Data

The sample data should be better. Can we improve it?

Files to be ignored

What files should be ignored? This doesn't look right.

xmdb/lib/xata.codegen.ts

Line 43 in 22a6ed1

"https://sahil-preet-s-workspace-f3ful6.eu-west-1.xata.sh/db/xmdb",

The modal should have an animation

When the modal opens it doesn't animate. We should add a simple animation.