feat: propagate PL24 part metadata, improve auth UX with Google sign-in prominence

- Add unavailable/remark/modelCodes/presel fields to categories and parts DB schema
- Pass PL24 unavailable flag through pipeline instead of filtering out records
- Show unavailable categories/parts at reduced opacity in grid, tree, and parts panel
- Display part remark and model codes as secondary info in parts table
- Move Google sign-in button above email form on login/register pages with branded icon
- Add public email existence check endpoint for better login error messages
- Update INDEX.md documentation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Sase Dev
2026-02-20 11:11:28 +00:00
parent 87f03f66ac
commit f3f3f57756
15 changed files with 561 additions and 328 deletions

View File

@@ -250,6 +250,7 @@ export class CategoriesService {
externalId: sg.code,
linkPath: sg.linkPath || null,
linkWid: sg.linkWid || null,
unavailable: sg.unavailable || false,
source: "pl24" as const,
}));
@@ -435,6 +436,10 @@ export class CategoriesService {
const val = parseInt(p.hotspotId!, 10);
return (val > 0 && val <= 2147483647) ? val : null;
})() : null,
unavailable: p.unavailable || false,
remark: p.remark || null,
modelCodes: p.modelCodes || null,
presel: p.presel || false,
source: "pl24" as const,
}));

View File

@@ -274,6 +274,7 @@ export const categories = pgTable(
externalId: varchar("external_id", { length: 100 }),
linkPath: text("link_path"),
linkWid: varchar("link_wid", { length: 100 }),
unavailable: boolean("unavailable").default(false).notNull(),
source: varchar("source", { length: 20 }).default("pl24").notNull(),
createdAt: timestamp("created_at", { withTimezone: true }).defaultNow().notNull(),
},
@@ -320,6 +321,10 @@ export const parts = pgTable(
quantity: integer("quantity"),
position: varchar("position", { length: 100 }),
hotspotIndex: integer("hotspot_index"),
unavailable: boolean("unavailable").default(false).notNull(),
remark: text("remark"),
modelCodes: varchar("model_codes", { length: 500 }),
presel: boolean("presel").default(false).notNull(),
source: varchar("source", { length: 20 }).default("pl24").notNull(),
createdAt: timestamp("created_at", { withTimezone: true }).defaultNow().notNull(),
},

View File

@@ -908,8 +908,7 @@ export class PL24Service {
records = responseData.groups as Array<Record<string, unknown>>;
}
const availableRecords = records.filter((record) => {
if (record.unavailable) return false;
const validRecords = records.filter((record) => {
const link = (record.link as Record<string, unknown>) || {};
// Servicepart records have no link.path but can use bomBaseLink
if (!link.path && !bomBasePath) return false;
@@ -918,7 +917,7 @@ export class PL24Service {
return true;
});
return availableRecords.map((record) => {
return validRecords.map((record) => {
const values = (record.values as Record<string, string>) || {};
const link = (record.link as Record<string, unknown>) || {};
@@ -950,11 +949,21 @@ export class PL24Service {
);
let name = separatorMatch ? separatorMatch[1].trim() : rawCaption;
const remarks = values.remarks || "";
const remarks = (values.remarks || "").replace(/\r?\n/g, " ").trim();
if (remarks) {
name = `${name} (${remarks})`;
}
const modelDesc = (values.modelDescriptions || "").replace(/\r?\n/g, " ").trim();
if (modelDesc) {
name = `${name} [${modelDesc}]`;
}
const illusNum = (values.illustrationNumber || "").replace(/\\-/g, "-").trim();
if (illusNum) {
name = `${name} {${illusNum}}`;
}
if (!name) name = code;
// Construct linkPath: use record's own link.path, or bomBaseLink + record id
@@ -972,6 +981,7 @@ export class PL24Service {
partCount: undefined,
linkPath: constructedPath,
linkWid: (link.wid as string) || (bomBasePath ? "servicePartsItemsTable" : undefined),
unavailable: !!record.unavailable,
};
});
}
@@ -1042,6 +1052,8 @@ export class PL24Service {
positionCode: String(part.pos || values.pos || ""),
modelCodes,
notes: modelCodes,
unavailable: !!part.unavailable,
presel: !!part.presel,
superseded,
hotspotId: (part.hotspotId as string) || undefined,
linkPath: (part.link as Record<string, string>)?.path,
@@ -1324,6 +1336,7 @@ export class PL24Service {
hotspotId: record.hotspotId || record.pos || undefined,
quantity: parseInt(values.qty || "1", 10) || 1,
modelCodes: values.restrictions || undefined,
presel: !!record.presel,
};
});
}

View File

@@ -462,6 +462,7 @@ export interface PL24MainGroup {
subGroups?: PL24SubGroup[];
linkPath?: string;
linkWid?: string;
unavailable?: boolean;
}
export interface PL24SubGroup {
@@ -471,6 +472,7 @@ export interface PL24SubGroup {
description?: string;
imageUrl?: string;
partCount?: number;
unavailable?: boolean;
}
export interface PL24Part {
@@ -484,6 +486,8 @@ export interface PL24Part {
positionCode?: string;
modelCodes?: string;
notes?: string;
unavailable?: boolean;
presel?: boolean;
superseded?: {
oldCode: string;
newCode: string;

View File

@@ -67,6 +67,10 @@ export class PartsService {
const val = parseInt(p.hotspotId!, 10);
return (val > 0 && val <= 2147483647) ? val : null;
})() : null,
unavailable: p.unavailable || false,
remark: p.remark || null,
modelCodes: p.modelCodes || null,
presel: p.presel || false,
source: "pl24" as const,
}));

View File

@@ -1,6 +1,7 @@
import { Controller, Get, Patch, Post, Delete, Body, Param, Query, UseGuards } from "@nestjs/common";
import { UsersService } from "./users.service";
import { CurrentUser } from "../common/decorators/current-user.decorator";
import { Public } from "../common/decorators/public.decorator";
import { Roles } from "../common/decorators/roles.decorator";
import { RolesGuard } from "../common/guards/roles.guard";
@@ -8,6 +9,13 @@ import { RolesGuard } from "../common/guards/roles.guard";
export class UsersController {
constructor(private usersService: UsersService) {}
@Public()
@Post("check-email")
async checkEmail(@Body() body: { email: string }) {
const user = await this.usersService.findByEmail(body.email);
return { exists: !!user };
}
@Get("me")
async getMe(@CurrentUser("id") userId: string) {
return this.usersService.findById(userId);

View File

@@ -13,6 +13,7 @@ interface Category {
partCount?: number;
schemaImageUrl?: string | null;
parentId?: string | null;
unavailable?: boolean;
}
interface CategoryGridProps {
@@ -252,6 +253,7 @@ export function CategoryGrid({ categories, vehicleId }: CategoryGridProps) {
key={category.id}
to="/dashboard/vehicles/$id/categories/$categoryId"
params={{ id: vehicleId, categoryId: category.id }}
className={category.unavailable ? "opacity-40" : undefined}
>
<CategoryCard
name={category.name}
@@ -269,7 +271,7 @@ export function CategoryGrid({ categories, vehicleId }: CategoryGridProps) {
key={category.id}
type="button"
onClick={() => handleDrillDown(category)}
className="text-left"
className={category.unavailable ? "text-left opacity-40" : "text-left"}
>
<CategoryCard
name={category.name}

View File

@@ -2,6 +2,7 @@ import { useState, useCallback, useEffect, useRef } from "react";
import { Link } from "@tanstack/react-router";
import { useQueryClient } from "@tanstack/react-query";
import { ChevronRight, ChevronDown, Loader2 } from "lucide-react";
import { cn } from "@sase/ui";
import { api } from "@/lib/api-client";
import { getCategoryIcon } from "@/lib/category-icons";
@@ -12,6 +13,7 @@ interface Category {
partCount?: number;
schemaImageUrl?: string | null;
parentId?: string | null;
unavailable?: boolean;
}
export function CategoryTree({ categories, vehicleId }: { categories: Category[]; vehicleId: string }) {
@@ -108,7 +110,10 @@ function CategoryNode({ category, vehicleId, level, parentPrefetching }: {
return (
<div>
<div
className="flex items-center gap-2 rounded-md px-2 py-1.5 text-sm hover:bg-accent"
className={cn(
"flex items-center gap-2 rounded-md px-2 py-1.5 text-sm hover:bg-accent",
category.unavailable && "opacity-40",
)}
style={{ paddingLeft: `${level * 16 + 8}px` }}
>
{loading ? (

View File

@@ -1,4 +1,4 @@
import { useCallback, useEffect, useRef, useState } from "react";
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
import { Check, Copy } from "lucide-react";
import { useSchemaStore } from "@/stores/schema.store";
import { cn } from "@sase/ui";
@@ -18,6 +18,19 @@ export function PartsPanel({ parts, vehicleId, categoryId }: PartsPanelProps) {
const rowRefs = useRef<Map<number, HTMLTableRowElement>>(new Map());
const [copiedId, setCopiedId] = useState<string | null>(null);
// Map group → IDs of available (non-unavailable) parts
const availableByGroup = useMemo(() => {
const map = new Map<number, string[]>();
for (const part of parts) {
if (part.hotspotIndex != null && !part.unavailable) {
const ids = map.get(part.hotspotIndex) || [];
ids.push(part.id);
map.set(part.hotspotIndex, ids);
}
}
return map;
}, [parts]);
const copyOemCode = useCallback((e: React.MouseEvent, partId: string, code: string) => {
e.stopPropagation();
navigator.clipboard.writeText(code);
@@ -81,13 +94,21 @@ export function PartsPanel({ parts, vehicleId, categoryId }: PartsPanelProps) {
key={part.id}
data-faro-user-action-name="select-part"
ref={(el) => {
// Store ref for the first part in each group (for scroll-to)
if (group != null && el && !rowRefs.current.has(group)) {
if (group == null || !el) return;
const availableIds = availableByGroup.get(group);
if (availableIds?.length === 1) {
// Single available part — scroll directly to it
if (part.id === availableIds[0]) {
rowRefs.current.set(group, el);
}
} else if (!rowRefs.current.has(group)) {
// Multiple or zero available — first part in group
rowRefs.current.set(group, el);
}
}}
className={cn(
"cursor-pointer border-b border-border/50 transition-colors duration-150",
part.unavailable && "opacity-40",
isSelected &&
"bg-primary/10 ring-1 ring-inset ring-primary/20",
isHighlighted && !isSelected && "bg-accent",
@@ -104,7 +125,14 @@ export function PartsPanel({ parts, vehicleId, categoryId }: PartsPanelProps) {
<td className="px-3 py-2 text-muted-foreground">
{part.hotspotIndex}
</td>
<td className="px-3 py-2 font-medium">{part.name}</td>
<td className="px-3 py-2">
<span className="font-medium">{part.name}</span>
{(part.remark || part.modelCodes) && (
<span className="block text-xs text-muted-foreground">
{[part.remark, part.modelCodes].filter(Boolean).join(" · ")}
</span>
)}
</td>
<td className="px-3 py-2 font-mono text-xs">
<span className="inline-flex items-center gap-1">
{part.oemCode && (

View File

@@ -8,6 +8,10 @@ export interface Part {
quantity: number | null;
position: string | null;
hotspotIndex: number | null;
unavailable?: boolean;
remark?: string;
modelCodes?: string;
presel?: boolean;
price?: number;
note?: string;
}

View File

@@ -3,6 +3,7 @@ import { Link, createFileRoute, useNavigate } from "@tanstack/react-router";
import { Button } from "@sase/ui";
import { Input } from "@sase/ui";
import { Label } from "@sase/ui";
import { api } from "@/lib/api-client";
import { signIn } from "@/lib/auth-client";
import { startAction } from "@/lib/faro";
import { capture } from "@/lib/posthog";
@@ -23,15 +24,27 @@ function LoginPage() {
startAction("login", { method: "email" });
setLoading(true);
try {
await signIn.email({ email, password });
const { error } = await signIn.email({ email, password });
if (error) {
try {
const { exists } = await api.post<{ exists: boolean }>("/users/check-email", { email });
if (!exists) {
toast.error("Kullanıcı bulunamadı", {
description: "Bu e-posta adresi ile kayıtlı bir hesap yok.",
});
} else {
toast.error("E-posta veya şifre hatalı");
}
} catch {
toast.error("E-posta veya şifre hatalı");
}
} else {
capture("user_logged_in", { method: "email" });
navigate({ to: "/dashboard/search" });
} catch {
toast.error("Giriş başarısız. E-posta veya şifre hatalı.");
} finally {
setLoading(false);
}
setLoading(false);
}
return (
@@ -46,6 +59,37 @@ function LoginPage() {
</p>
</div>
{/* Google */}
<Button
variant="outline"
className="w-full"
onClick={() => {
startAction("login", { method: "google" });
capture("user_logged_in", { method: "google" });
signIn.social({ provider: "google", callbackURL: "/dashboard/search" });
}}
>
<svg className="mr-2 h-5 w-5" viewBox="0 0 24 24" aria-hidden="true">
<path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z" fill="#4285F4" />
<path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853" />
<path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05" />
<path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335" />
</svg>
Google ile Giriş Yap
</Button>
{/* Divider */}
<div className="relative">
<div className="absolute inset-0 flex items-center">
<span className="w-full border-t" />
</div>
<div className="relative flex justify-center text-xs uppercase">
<span className="bg-background px-2 text-muted-foreground">
veya
</span>
</div>
</div>
{/* Form */}
<form onSubmit={handleSubmit} className="space-y-5">
<div className="space-y-2">
@@ -92,32 +136,6 @@ function LoginPage() {
</Button>
</form>
{/* Divider + Google */}
<div className="space-y-3">
<div className="relative">
<div className="absolute inset-0 flex items-center">
<span className="w-full border-t" />
</div>
<div className="relative flex justify-center text-xs uppercase">
<span className="bg-background px-2 text-muted-foreground">
veya
</span>
</div>
</div>
<Button
variant="outline"
className="w-full"
onClick={() => {
startAction("login", { method: "google" });
capture("user_logged_in", { method: "google" });
signIn.social({ provider: "google", callbackURL: "/dashboard/search" });
}}
>
Google ile Giriş Yap
</Button>
</div>
{/* Register link */}
<p className="text-center text-sm">
Hesabınız yok mu?{" "}

View File

@@ -61,6 +61,37 @@ function RegisterPage() {
</div>
</div>
{/* Google */}
<Button
variant="outline"
className="w-full"
onClick={() => {
startAction("register", { method: "google" });
capture("user_signed_up", { method: "google" });
signIn.social({ provider: "google", callbackURL: redirectUrl });
}}
>
<svg className="mr-2 h-5 w-5" viewBox="0 0 24 24" aria-hidden="true">
<path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 0 1-2.2 3.32v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.1z" fill="#4285F4" />
<path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853" />
<path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z" fill="#FBBC05" />
<path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z" fill="#EA4335" />
</svg>
Google ile Kayıt Ol
</Button>
{/* Divider */}
<div className="relative">
<div className="absolute inset-0 flex items-center">
<span className="w-full border-t" />
</div>
<div className="relative flex justify-center text-xs uppercase">
<span className="bg-background px-2 text-muted-foreground">
veya
</span>
</div>
</div>
{/* Form */}
<form onSubmit={handleSubmit} className="space-y-5">
<div className="space-y-2">
@@ -102,32 +133,6 @@ function RegisterPage() {
</Button>
</form>
{/* Divider + Google */}
<div className="space-y-3">
<div className="relative">
<div className="absolute inset-0 flex items-center">
<span className="w-full border-t" />
</div>
<div className="relative flex justify-center text-xs uppercase">
<span className="bg-background px-2 text-muted-foreground">
veya
</span>
</div>
</div>
<Button
variant="outline"
className="w-full"
onClick={() => {
startAction("register", { method: "google" });
capture("user_signed_up", { method: "google" });
signIn.social({ provider: "google", callbackURL: redirectUrl });
}}
>
Google ile Kayıt Ol
</Button>
</div>
<p className="text-center text-xs text-muted-foreground">
Kayıt olunca hemen VIN aramaya başlayın
</p>