Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Show Details Paymentb Enhancement #104

Merged
merged 2 commits into from
Dec 15, 2023
Merged

feat: Show Details Paymentb Enhancement #104

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
2619d41
feat: Show Details Paymentb Enhancement
Dec 15, 2023
746228a
feat: dead code removal
Dec 15, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
114 changes: 1 addition & 113 deletions src/screens/HyperSwitch/Order/OrderEntity.res
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,35 +1,6 @@
open OrderTypes
open LogicUtils

let getDateCreatedObject = () => {
let currentDate = Js.Date.now()
let filterCreatedDict = Js.Dict.empty()
let currentTimestamp = currentDate->Js.Date.fromFloat->Js.Date.toISOString
Js.Dict.set(
filterCreatedDict,
"lte",
Js.Json.string(currentTimestamp->TimeZoneHook.formattedISOString("YYYY-MM-DDTHH:mm:[00][Z]")),
)

let prevMins = {
let presentDayInString = Js.Date.fromFloat(currentDate)
let prevDateInFloat = Js.Date.getMinutes(presentDayInString) -. 30.0
Js.Date.setMinutes(presentDayInString, prevDateInFloat)
}

Js.Dict.set(
filterCreatedDict,
"gte",
Js.Json.string(
prevMins
->Js.Date.fromFloat
->Js.Date.toISOString
->TimeZoneHook.formattedISOString("YYYY-MM-DDTHH:mm:[00][Z]"),
),
)

Js.Json.object_(filterCreatedDict)
}
module CurrencyCell = {
@react.component
let make = (~amount, ~currency) => {
Expand Down Expand Up @@ -785,38 +756,7 @@ let getCell = (order, colType: colType): Table.cell => {
}
}

let ordersDefaultCols = Recoil.atom(. "hyperSwitchOrderDefaultCols", defaultColumns)

let getOptionsArr = optionObjArr => {
optionObjArr->Js.Array2.map(item => {
let temp: EntityType.optionType<'t> = {
urlKey: item.urlKey,
field: FormRenderer.makeFieldInfo(
~label=item.label,
~name=item.urlKey,
~customInput=InputFields.textInput(),
(),
),
parser: val => {
val
},
localFilter: None,
}
temp
})
}

// let options: array<EntityType.optionType<'t>> = getOptionsArr(optionObj)

let getDefaultFilters = dateCreatedObject => {
let dict = Js.Dict.empty()
let filtersDict = Js.Dict.empty()
Js.Dict.set(filtersDict, "dateCreated", dateCreatedObject)
Js.Dict.set(dict, "offset", Js.Json.number(0.0))
Js.Dict.set(dict, "filters", Js.Json.object_(filtersDict))

Js.Json.object_(dict)
}
let _ = Recoil.atom(. "hyperSwitchOrderDefaultCols", defaultColumns)

let itemToObjMapperForFRMDetails = dict => {
{
Expand Down Expand Up @@ -888,58 +828,6 @@ let itemToObjMapper = dict => {
}
}

let datePickerField = (~limit) => {
FormRenderer.makeMultiInputFieldInfo(
~label="Date Range",
~comboCustomInput=InputFields.dateRangeField(
~startKey="filters.dateCreated.gte",
~endKey="filters.dateCreated.lte",
~format="YYYY-MM-DDTHH:mm:ss[Z]",
~showTime=true,
~disablePastDates={false},
~disableFutureDates={true},
~predefinedDays=[
Hour(0.5),
Hour(1.0),
Hour(6.0),
Today,
Yesterday,
Day(2.0),
Day(7.0),
Day(30.0),
ThisMonth,
LastMonth,
],
~numMonths=2,
~disableApply=false,
~dateRangeLimit=limit,
~optFieldKey="filters.dateCreated.opt",
(),
),
~inputFields=[],
~isRequired=true,
(),
)
}

/* let initialFilterFields: array<EntityType.initialFilters<'t>> = [
{
field: makeFieldInfo(
~label="Customer Id",
~name="customer_id",
~customInput=orderFilterInput(),
~parse=Parsers.arrayParser,
~format=Formatter.numericArrayStringFormat,
(),
),
localFilter: None,
},
{
localFilter: None,
field: datePickerField(~limit=7),
},
] */

let getOrders: Js.Json.t => array<order> = json => {
getArrayDataFromJson(json, itemToObjMapper)
}
Expand Down
6 changes: 1 addition & 5 deletions src/screens/HyperSwitch/Order/OrderUIUtils.res
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,12 @@ module PaymentLogs = {
let make = (~id, ~createdAt) => {
let {auditTrail} = HyperswitchAtom.featureFlagAtom->Recoil.useRecoilValueFromAtom
let isSmallDevice = MatchMedia.useMatchMedia("(max-width: 700px)")
let showPaymentLogsComp = auditTrail

<div className="overflow-x-scroll">
<UIUtils.RenderIf condition={!isSmallDevice && showPaymentLogsComp}>
{HSwitchOrderUtils.eventLogHeader}
</UIUtils.RenderIf>
<UIUtils.RenderIf condition={isSmallDevice}>
<EventLogMobileView />
</UIUtils.RenderIf>
<UIUtils.RenderIf condition={!isSmallDevice && showPaymentLogsComp}>
<UIUtils.RenderIf condition={!isSmallDevice && auditTrail}>
<PaymentLogs paymentId=id createdAt />
</UIUtils.RenderIf>
</div>
Expand Down
43 changes: 31 additions & 12 deletions src/screens/HyperSwitch/Order/ShowOrder.res
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -147,17 +147,6 @@ module OrderInfo = {
</div>
</div>
</UIUtils.RenderIf>
<UIUtils.RenderIf condition={isMetadata && !(order.metadata->LogicUtils.isEmptyDict)}>
<div className="mb-10">
<div className="bg-white p-5 border rounded-md">
<PaymentLogs.PrettyPrintJson
jsonToDisplay={order.metadata->Js.Json.stringifyAny->Belt.Option.getWithDefault("")}
headerText="Payment Metadata"
overrideBackgroundColor="bg-white"
/>
</div>
</div>
</UIUtils.RenderIf>
<UIUtils.RenderIf condition={isMetadata}>
<div className="mb-10">
<Details
Expand Down Expand Up @@ -808,7 +797,37 @@ let make = (~id) => {
/>
</div>
<UIUtils.RenderIf condition={featureFlagDetails.auditTrail}>
<OrderUIUtils.PaymentLogs id createdAt />
<RenderAccordian
accordion={[
{
title: "Events and logs",
renderContent: () => {
<OrderUIUtils.PaymentLogs id createdAt />
},
renderContentOnTop: None,
},
]}
/>
</UIUtils.RenderIf>
<UIUtils.RenderIf condition={!(order.metadata->LogicUtils.isEmptyDict)}>
<RenderAccordian
accordion={[
{
title: "Payment Metadata",
renderContent: () => {
<div className="bg-white p-2">
<PaymentLogs.PrettyPrintJson
jsonToDisplay={order.metadata
->Js.Json.stringifyAny
->Belt.Option.getWithDefault("")}
overrideBackgroundColor="bg-white"
/>
</div>
},
renderContentOnTop: None,
},
]}
/>
</UIUtils.RenderIf>
<RenderAccordian
accordion={[
Expand Down
45 changes: 26 additions & 19 deletions src/screens/HyperSwitch/PaymentLogs/PaymentLogs.res
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ module PrettyPrintJson = {
@react.component
let make = (
~jsonToDisplay,
~headerText,
~headerText=None,
~maxHeightClass="max-h-25-rem",
~overrideBackgroundColor="bg-hyperswitch_background",
) => {
Expand Down Expand Up @@ -34,30 +34,37 @@ module PrettyPrintJson = {
showToast(~message="Copied to Clipboard!", ~toastType=ToastSuccess, ())
hyperswitchMixPanel(
~pageName=`${url.path->getListHead}`,
~contextName=`${headerText->toCamelCase}`,
~contextName=`${headerText->Belt.Option.getWithDefault("")->toCamelCase}`,
~actionName="copied",
(),
)
}

let copyParsedJson =
<div onClick={_ => handleOnClickCopy(~parsedValue=parsedJson)} className="cursor-pointer">
<img src={`/assets/CopyToClipboard.svg`} />
</div>

<div className="flex flex-col gap-2 my-2">
<UIUtils.RenderIf condition={parsedJson->Js.String2.length > 0}>
{<>
<div className="flex justify-between items-center">
<p className="font-bold text-fs-16 text-jp-gray-900 text-opacity-75">
{headerText->React.string}
</p>
<div
onClick={_ => handleOnClickCopy(~parsedValue=parsedJson)} className="cursor-pointer">
<img src={`/assets/CopyToClipboard.svg`} />
<UIUtils.RenderIf condition={headerText->Belt.Option.isSome}>
<div className="flex justify-between items-center">
<p className="font-bold text-fs-16 text-jp-gray-900 text-opacity-75">
{headerText->Belt.Option.getWithDefault("")->React.string}
</p>
{copyParsedJson}
</div>
</UIUtils.RenderIf>
<div className="flex items-start justify-between">
<pre
className={`${overrideBackgroundColor} p-3 text-jp-gray-900 dark:bg-jp-gray-950 dark:bg-opacity-100 ${isTextVisible
? "overflow-visible "
: `overflow-clip h-fit ${maxHeightClass}`} text-fs-13 text font-medium`}>
{parsedJson->React.string}
</pre>
{copyParsedJson}
</div>
<pre
className={`${overrideBackgroundColor} p-3 text-jp-gray-900 dark:bg-jp-gray-950 dark:bg-opacity-100 ${isTextVisible
? "overflow-visible "
: `overflow-clip h-fit ${maxHeightClass}`} text-fs-13 text font-medium`}>
{parsedJson->React.string}
</pre>
<Button
text={isTextVisible ? "Hide" : "See more"}
customButtonStyle="h-6 w-8 flex flex-1 justify-center m-1"
Expand All @@ -68,7 +75,7 @@ module PrettyPrintJson = {
<UIUtils.RenderIf condition={parsedJson->Js.String2.length === 0}>
<div className="flex flex-col justify-start items-start gap-2 h-25-rem">
<p className="font-bold text-fs-16 text-jp-gray-900 text-opacity-75">
{headerText->React.string}
{headerText->Belt.Option.getWithDefault("")->React.string}
</p>
<p className="font-normal text-fs-14 text-jp-gray-900 text-opacity-50">
{"Failed to load!"->React.string}
Expand Down Expand Up @@ -405,7 +412,7 @@ let make = (~paymentId, ~createdAt) => {
</div>
} else {
<Section
customCssClass={`border border-jp-gray-940 border-opacity-75 bg-white dark:bg-jp-gray-lightgray_background rounded-md p-10 flex gap-16 justify-between h-48-rem !max-h-50-rem !min-w-[55rem] overflow-scroll`}>
customCssClass={`bg-white dark:bg-jp-gray-lightgray_background rounded-md pt-2 pb-4 px-10 flex gap-16 justify-between h-48-rem !max-h-50-rem !min-w-[55rem] overflow-scroll`}>
<div className="flex flex-col w-1/2 gap-12 overflow-y-scroll">
<p className="text-lightgray_background font-semibold text-fs-16">
{"Audit Trail"->React.string}
Expand Down Expand Up @@ -436,14 +443,14 @@ let make = (~paymentId, ~createdAt) => {
<UIUtils.RenderIf condition={requestObject->Js.String2.length > 0}>
<PrettyPrintJson
jsonToDisplay=requestObject
headerText={currentSelectedType === Payment ? "Request body" : "Event"}
headerText={Some(currentSelectedType === Payment ? "Request body" : "Event")}
maxHeightClass={responseObject->Js.String2.length > 0 ? "max-h-25-rem" : ""}
/>
</UIUtils.RenderIf>
<UIUtils.RenderIf condition={responseObject->Js.String2.length > 0}>
<PrettyPrintJson
jsonToDisplay=responseObject
headerText={currentSelectedType === Payment ? "Response body" : "Metadata"}
headerText={Some(currentSelectedType === Payment ? "Response body" : "Metadata")}
/>
</UIUtils.RenderIf>
</div>
Expand Down
Loading