106 lines
3 KiB
TypeScript
106 lines
3 KiB
TypeScript
// * Packages
|
|
import { usePage } from "@inertiajs/react";
|
|
import { ExternalLinkIcon } from "lucide-react";
|
|
// * Components shadcn
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipTrigger,
|
|
} from "@/components/ui/tooltip";
|
|
// * Other
|
|
import { AppEnv } from "@/types/global";
|
|
import useTrans from "@/hooks/use-translations";
|
|
import str from "@/hooks/use-string";
|
|
import { cn, GetTranslation } from "@/lib/utils";
|
|
|
|
interface GoToFrontViewProps {
|
|
/** Model Name used to translate the helper */
|
|
modelName: string;
|
|
|
|
/** Field data to build path */
|
|
pathField: string;
|
|
|
|
/** Additionnal segment used in the url */
|
|
additionalGroupPath?: string | null;
|
|
|
|
/** Does the actual page status available in front */
|
|
isAvailable?: boolean;
|
|
|
|
/** Set visually in column */
|
|
isColumn?: boolean;
|
|
}
|
|
|
|
export default function GoToFrontView({
|
|
modelName,
|
|
pathField,
|
|
additionalGroupPath = null,
|
|
isAvailable = false,
|
|
isColumn = false,
|
|
}: GoToFrontViewProps) {
|
|
const { url } = usePage().props.appEnv as AppEnv;
|
|
|
|
const anchorAccessPage = useTrans("uwil-backend::back.access_model", {
|
|
params: {
|
|
model: modelName,
|
|
},
|
|
});
|
|
|
|
const cleanUrl = url.endsWith("/") ? url.slice(0, -1) : url;
|
|
|
|
const definitivePath = [cleanUrl, additionalGroupPath, pathField]
|
|
.filter(Boolean)
|
|
.join("/");
|
|
|
|
return (
|
|
<small
|
|
className={`flex ${isColumn ? "flex-col items-start" : "flex-row items-center"} justify-start`}
|
|
>
|
|
{isAvailable ? (
|
|
<>
|
|
{str(
|
|
GetTranslation("uwil-backend::back.access_to_front_page", {
|
|
params: {
|
|
model: modelName,
|
|
},
|
|
}),
|
|
)
|
|
.ucFirst()
|
|
.value()}
|
|
<Tooltip>
|
|
<TooltipTrigger asChild>
|
|
<a
|
|
href={definitivePath}
|
|
className={cn(
|
|
"flex justify-center items-center rounded-md font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 underline-offset-4 hover:underline text-blue-600 hover:text-blue-600/80 visited:text-purple-600 w-fit gap-1.5",
|
|
{ "ms-1": !isColumn },
|
|
)}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
>
|
|
<p className="flex-1">{definitivePath}</p>
|
|
<ExternalLinkIcon size={12} />
|
|
</a>
|
|
</TooltipTrigger>
|
|
<TooltipContent>{anchorAccessPage}</TooltipContent>
|
|
</Tooltip>
|
|
</>
|
|
) : (
|
|
<>
|
|
{str(
|
|
GetTranslation(
|
|
"uwil-backend::back.access_to_front_page_when_published",
|
|
{
|
|
params: {
|
|
model: modelName,
|
|
},
|
|
},
|
|
),
|
|
)
|
|
.ucFirst()
|
|
.value()}
|
|
:<span className="italic ms-1">{definitivePath}</span>
|
|
</>
|
|
)}
|
|
</small>
|
|
);
|
|
}
|