-- Compiled with roblox-ts v3.0.0
local TS = _G[script]
local _vide = TS.import(script, TS.getModule(script, "@rbxts", "vide").src)
local Vide = _vide
local derive = _vide.derive
local HISTORY_TEXT_SIZE = TS.import(script, script.Parent.Parent.Parent, "constants", "text").HISTORY_TEXT_SIZE
local px = TS.import(script, script.Parent.Parent.Parent, "hooks", "use-px").px
local options = TS.import(script, script.Parent.Parent.Parent, "store").options
local Frame = TS.import(script, script.Parent.Parent, "ui", "frame").Frame
local Group = TS.import(script, script.Parent.Parent, "ui", "group").Group
local Outline = TS.import(script, script.Parent.Parent, "ui", "outline").Outline
local Text = TS.import(script, script.Parent.Parent, "ui", "text").Text
local TextField = TS.import(script, script.Parent.Parent, "ui", "text-field").TextField
local function HistoryLine(_param)
	local data = _param.data
	local position = _param.position
	local order = _param.order
	local date = derive(function()
		local dateTime = DateTime.fromUnixTimestamp(data.sentAt):FormatLocalTime("LT", "en-us")
		local dateParts = string.split(dateTime, " ")
		return `<b>{dateParts[1]}</b> {dateParts[2]}`
	end)
	return Vide.jsx(Group, {
		automaticSize = "Y",
		size = UDim2.fromScale(1, 0),
		position = position,
		layoutOrder = order,
	}, Vide.jsx(Frame, {
		backgroundColor = function()
			return options().palette.surface
		end,
		size = function()
			return UDim2.fromOffset(px(76), px(HISTORY_TEXT_SIZE + 4))
		end,
		cornerRadius = function()
			return UDim.new(0, px(4))
		end,
	}, Vide.jsx(Text, {
		size = UDim2.fromScale(1, 1),
		text = date,
		textColor = function()
			return options().palette.text
		end,
		textSize = function()
			return px(HISTORY_TEXT_SIZE)
		end,
		richText = true,
	}), Vide.jsx(Outline, {
		innerThickness = function()
			return px(1)
		end,
		innerTransparency = 0.25,
		innerColor = function()
			return if data.success then options().palette.success else options().palette.error
		end,
		outerThickness = 0,
		cornerRadius = function()
			return UDim.new(0, px(4))
		end,
	})), Vide.jsx(TextField, {
		automaticSize = "Y",
		anchor = Vector2.new(1, 0),
		size = function()
			return UDim2.new(1, -px(84), 0, 0)
		end,
		position = function()
			return UDim2.new(1, 0, 0, px(2))
		end,
		text = data.text,
		textSize = function()
			return px(HISTORY_TEXT_SIZE)
		end,
		textColor = function()
			local palette = options().palette
			return if data.success then palette.text else palette.error
		end,
		textEditable = false,
		textXAlignment = "Left",
		clearTextOnFocus = false,
		font = function()
			return options().font.medium
		end,
		richText = true,
	}))
end
return {
	HistoryLine = HistoryLine,
}