behnam/radio-station
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

feature/version-1 #1

Open
behnam wants to merge 9 commits from feature/version-1 into main
pull from: feature/version-1
merge into: behnam:main
Conversation 0 Commits 9 Files Changed 15 +13 -7
3 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit d341ac4479 - Show all commits

2
app/components/station-player.tsx
View File

@ -46,7 +46,7 @@ export function StationPlayer({ station, nextPrevStationIds }: StationPlayerProp
} }
}; };
importComponent() importComponent()
}, [station]) }, [station, nextPrevStationIds, route])
if (!station || !player) { if (!station || !player) {
return <></>; return <></>;

11
app/components/stations-gallery.tsx
View File

@ -1,6 +1,6 @@
import { PlayIcon } from "@heroicons/react/24/solid"; import { PlayIcon, SpeakerWaveIcon } from "@heroicons/react/24/solid";
import type { Tag } from "@prisma/client"; import type { Tag } from "@prisma/client";
import { Link } from "@remix-run/react"; import { Link, useLocation } from "@remix-run/react";
import { ListenLink } from "~/components/page-layout"; import { ListenLink } from "~/components/page-layout";
import type { StationWithTagsClientSide } from "~/models/station.server"; import type { StationWithTagsClientSide } from "~/models/station.server";
import { getStationUrl, type ConvertDatesToStrings } from "~/utils"; import { getStationUrl, type ConvertDatesToStrings } from "~/utils";
@ -11,6 +11,8 @@ export type StationsGalleryProps = {
}; };
export function StationsGallery({ stations, tag }: StationsGalleryProps) { export function StationsGallery({ stations, tag }: StationsGalleryProps) {
const location = useLocation();
const currentStationId = new URLSearchParams(location.search).get('station')?.trim()
return ( return (
<div className="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-4 gap-4"> <div className="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-4 gap-4">
{stations.map((station) => { {stations.map((station) => {
@ -18,9 +20,14 @@ export function StationsGallery({ stations, tag }: StationsGalleryProps) {
<div key={station.id} className="card card-compact bg-base-100 shadow-xl mb-[70px]"> <div key={station.id} className="card card-compact bg-base-100 shadow-xl mb-[70px]">
<figure><img src={station.imgUrl} alt="Radio Station" /></figure> <figure><img src={station.imgUrl} alt="Radio Station" /></figure>
<div className="card-body"> <div className="card-body">
<div className="flex items-center justify-start gap-2">
<h2 className="card-title"> <h2 className="card-title">
{station.name} {station.name}
</h2> </h2>
{station.id === currentStationId ? <div className="w-4 h-4">
<SpeakerWaveIcon />
</div> : null}
</div>
<h2 className="flex gap-1"> <h2 className="flex gap-1">
{station.tags.map((t, id) => { {station.tags.map((t, id) => {
return <ListenLink key={id} to={`/listen/tag/${t.tag.slug}`} return <ListenLink key={id} to={`/listen/tag/${t.tag.slug}`}

1
app/routes/listen.tsx
View File

@ -22,7 +22,6 @@ export async function loader({ request }: LoaderArgs) {
export default function ListenLayout() { export default function ListenLayout() {
const { tags, user, station, prevNextStationIds } = useLoaderData<typeof loader>(); const { tags, user, station, prevNextStationIds } = useLoaderData<typeof loader>();
console.log(prevNextStationIds)
return ( return (
<PageLayout tags={tags} user={user} station={station}> <PageLayout tags={tags} user={user} station={station}>
<Outlet /> <Outlet />