feat(dashboard): manage discounts conditions (#6620)
**What** - forms for managing discount conditions --- https://github.com/medusajs/medusa/assets/16856471/bb0b3fe8-fa60-479b-bc42-6db9d422bcdf Co-authored-by: Kasper Fabricius Kristensen <45367945+kasperkristensen@users.noreply.github.com>
This commit is contained in:
co-authored by
Kasper Fabricius Kristensen
parent
9288f53327
commit
a1b4aff127
@@ -1,4 +1,4 @@
|
||||
import { Text, Tooltip, clx } from "@medusajs/ui"
|
||||
import { Tooltip, clx } from "@medusajs/ui"
|
||||
import { useTranslation } from "react-i18next"
|
||||
|
||||
type ListSummaryProps = {
|
||||
@@ -12,46 +12,54 @@ type ListSummaryProps = {
|
||||
*/
|
||||
list: string[]
|
||||
/**
|
||||
* Is hte summary displayed inline.
|
||||
* Is the summary displayed inline.
|
||||
* Determines whether the center text is truncated if there is no space in the container
|
||||
*/
|
||||
inline?: boolean
|
||||
|
||||
className?: string
|
||||
}
|
||||
|
||||
export const ListSummary = ({ list, inline, n = 2 }: ListSummaryProps) => {
|
||||
export const ListSummary = ({
|
||||
list,
|
||||
className,
|
||||
inline,
|
||||
n = 2,
|
||||
}: ListSummaryProps) => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
const title = t("general.plusCountMore", {
|
||||
count: list.length - n,
|
||||
})
|
||||
|
||||
return (
|
||||
<div
|
||||
className={clx("text-ui-fg-subtle gap-x-2", {
|
||||
"inline-flex": inline,
|
||||
flex: !inline,
|
||||
})}
|
||||
className={clx(
|
||||
"text-ui-fg-subtle txt-compact-small gap-x-1 overflow-hidden",
|
||||
{
|
||||
"inline-flex": inline,
|
||||
flex: !inline,
|
||||
},
|
||||
className
|
||||
)}
|
||||
>
|
||||
<Text as="span" leading="compact" size="small" className="truncate">
|
||||
{list.slice(0, n).join(", ")}
|
||||
</Text>
|
||||
<div className="flex-1 truncate">
|
||||
<span className="truncate">{list.slice(0, n).join(", ")}</span>
|
||||
</div>
|
||||
{list.length > n && (
|
||||
<Tooltip
|
||||
content={
|
||||
<ul>
|
||||
{list.slice(n).map((c) => (
|
||||
<li key={c}>{c}</li>
|
||||
))}
|
||||
</ul>
|
||||
}
|
||||
>
|
||||
<Text
|
||||
as="span"
|
||||
size="small"
|
||||
weight="plus"
|
||||
leading="compact"
|
||||
className="cursor-default whitespace-nowrap"
|
||||
<div className="whitespace-nowrap">
|
||||
<Tooltip
|
||||
content={
|
||||
<ul>
|
||||
{list.slice(n).map((c) => (
|
||||
<li key={c}>{c}</li>
|
||||
))}
|
||||
</ul>
|
||||
}
|
||||
>
|
||||
{t("general.plusCountMore", {
|
||||
count: list.length - n,
|
||||
})}
|
||||
</Text>
|
||||
</Tooltip>
|
||||
<span className="cursor-default whitespace-nowrap">{title}</span>
|
||||
</Tooltip>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
|
||||
+41
@@ -0,0 +1,41 @@
|
||||
import { Tooltip } from "@medusajs/ui"
|
||||
import format from "date-fns/format"
|
||||
import { useTranslation } from "react-i18next"
|
||||
|
||||
type DateCellProps = {
|
||||
date: Date
|
||||
}
|
||||
|
||||
export const CreatedAtCell = ({ date }: DateCellProps) => {
|
||||
const value = new Date(date)
|
||||
value.setMinutes(value.getMinutes() - value.getTimezoneOffset())
|
||||
|
||||
const hour12 = Intl.DateTimeFormat().resolvedOptions().hour12
|
||||
const timestampFormat = hour12 ? "dd MMM yyyy hh:MM a" : "dd MMM yyyy HH:MM"
|
||||
|
||||
return (
|
||||
<div className="flex h-full w-full items-center overflow-hidden">
|
||||
<Tooltip
|
||||
className="z-10"
|
||||
content={
|
||||
<span className="text-pretty">{`${format(
|
||||
value,
|
||||
timestampFormat
|
||||
)}`}</span>
|
||||
}
|
||||
>
|
||||
<span className="truncate">{format(value, "dd MMM yyyy")}</span>
|
||||
</Tooltip>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export const CreatedAtHeader = () => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<div className="flex h-full w-full items-center">
|
||||
<span className="truncate">{t("fields.createdAt")}</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
export * from "./created-at-cell"
|
||||
Reference in New Issue
Block a user