local s=game:GetService("\082\101\112\108\105\099\097\116\101\100\083\116\111\114\097\103\101")local D=game:GetService("\080\108\097\121\101\114\115")local G=D.LocalPlayer local w=script.Parent local Y=s:WaitForChild("\108\105\098")local j=s:WaitForChild("\099\111\109\109\111\110")local m=require(j:WaitForChild("\083\101\108\101\099\116\111\114\115"))local b=require(j.util:WaitForChild("\103\101\116\065\115\115\101\116\077\111\100\101\108"))local h=require(Y:WaitForChild("\082\111\097\099\116"))local O=require(Y:WaitForChild("\082\111\097\099\116\082\111\100\117\120"))local V=require(w:WaitForChild("\077\111\100\101\108\086\105\101\119\070\114\097\109\101"))local c=h.PureComponent:extend("\065\115\115\101\116\066\117\116\116\111\110")function c.init(D,s)D:setState(function()return{hovered=false}end)end function c.render(s)local D=s.state.hovered local G=s.props.equipped local w=s.props.asset if not w then error("\065\115\115\101\116 \110\111\116 \115\117\112\112\108\105\101\100 \116\111 \065\115\115\101\116\066\117\116\116\111\110 \101\108\101\109\101\110\116\033")end local Y={}local j if G then j=h.createElement("\073\109\097\103\101\076\097\098\101\108",{Size=UDim2.new(0,24,0,24);AnchorPoint=Vector2.new(1,1),Position=UDim2.new(1,-4,1,-4),Image="\114\098\120\097\115\115\101\116\105\100\058\047\047\050\054\051\055\055\049\055\054\048\048";ImageColor3=Color3.fromRGB(2,183,87);BackgroundColor3=Color3.fromRGB(255,255,255),BorderSizePixel=0})end local m if w.thumbnailImage then m=h.createElement("\073\109\097\103\101\076\097\098\101\108",{Image=w.thumbnailImage,Size=UDim2.new(1,0,1,0),BackgroundTransparency=1})end local O={}O.listLayout=h.createElement("\085\073\076\105\115\116\076\097\121\111\117\116",{FillDirection=Enum.FillDirection.Horizontal;HorizontalAlignment=Enum.HorizontalAlignment.Right,Padding=UDim.new(0,4)})if(w.metadata or{}).isRainbow then O.rainbow=h.createElement("\073\109\097\103\101\076\097\098\101\108",{BackgroundTransparency=1,Image="\114\098\120\097\115\115\101\116\105\100\058\047\047\051\050\049\051\054\054\057\050\050\051";Size=UDim2.new(0,16,0,16)})end local c=h.createElement("\070\114\097\109\101",{BackgroundTransparency=1;Size=UDim2.new(1,-8,0,16),Position=UDim2.new(1,-4,0,4);AnchorPoint=Vector2.new(1,0)},O)Y.padding=h.createElement("\085\073\080\097\100\100\105\110\103",{PaddingLeft=UDim.new(0,8),PaddingTop=UDim.new(0,8);PaddingRight=UDim.new(0,8);PaddingBottom=UDim.new(0,8)})Y.gamutGrid=h.createElement("\073\109\097\103\101\076\097\098\101\108",{Size=UDim2.new(1,0,1,0);Image="\114\098\120\097\115\115\101\116\105\100\058\047\047\055\049\049\056\050\049\053\048\057";ScaleType=Enum.ScaleType.Tile;TileSize=UDim2.new(0,256,0,256),BorderColor3=D and Color3.fromRGB(204,204,204)or Color3.fromRGB(230,230,230);ImageColor3=Color3.fromRGB(223,223,223),BackgroundColor3=Color3.fromRGB(255,255,255)},{viewport=h.createElement(V,{model=b(s.props.asset.id);Size=UDim2.new(1,0,1,0),ImageColor3=s.props.blackout and Color3.new(0,0,0)or Color3.new(1,1,1)},{isEquipped=j,modifiers=c,thumbnailImage=m})})return h.createElement("\084\101\120\116\066\117\116\116\111\110",{BackgroundColor3=D and Color3.fromRGB(223,223,223)or Color3.fromRGB(255,255,255);BorderColor3=D and Color3.fromRGB(204,204,204)or Color3.fromRGB(230,230,230);AutoButtonColor=false,LayoutOrder=s.props.LayoutOrder or 0,Text="";[h.Event.MouseButton1Click]=function()s.props.onClick(s.props.asset.id,s.props.equipped)end;[h.Event.MouseEnter]=function()s:setState(function()return{hovered=true}end)end,[h.Event.MouseLeave]=function()s:setState(function()return{hovered=false}end)end},Y)end local function v(s,D)return{equipped=m.isEquipped(s,G,D.asset.id)}end c=(O.connect(v,nil))(c)return c
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local Players = game:GetService("Players")
local LocalPlayer = Players.LocalPlayer

local component = script.Parent
local lib = ReplicatedStorage:WaitForChild("lib")
local common = ReplicatedStorage:WaitForChild("common")

local Selectors = require(common:WaitForChild("Selectors"))

local getAssetModel = require(common.util:WaitForChild("getAssetModel"))
local Roact = require(lib:WaitForChild("Roact"))
local RoactRodux = require(lib:WaitForChild("RoactRodux"))

local ModelViewFrame = require(component:WaitForChild("ModelViewFrame"))
local AssetButton = Roact.PureComponent:extend("AssetButton")

function AssetButton:init(initialProps)
    self:setState( function() return {
        hovered = false,
    } end)
end

function AssetButton:render()
    local hovered = self.state.hovered
    local equipped = self.props.equipped
    local asset = self.props.asset

    if not asset then error("Asset not supplied to AssetButton element!") end

    local children = {}
    local checkmark
    if equipped then
        checkmark = Roact.createElement("ImageLabel", {
            Size = UDim2.new(0,24,0,24),

            AnchorPoint = Vector2.new(1,1),
            Position = UDim2.new(1,-4,1,-4),

            Image = "rbxassetid://2637717600",
            ImageColor3 = Color3.fromRGB(2, 183, 87),

            BackgroundColor3 = Color3.fromRGB(255,255,255),
            BorderSizePixel = 0,
        })
    end

    local thumbnailImage
    if asset.thumbnailImage then
        thumbnailImage = Roact.createElement("ImageLabel", {
            Image = asset.thumbnailImage,
            Size = UDim2.new(1,0,1,0),
            BackgroundTransparency = 1,
        })
    end

    local modifiers = {}

    modifiers.listLayout = Roact.createElement("UIListLayout", {
        FillDirection = Enum.FillDirection.Horizontal,
        HorizontalAlignment = Enum.HorizontalAlignment.Right,
        Padding = UDim.new(0,4),
    })

    if (asset.metadata or {}).isRainbow then
        modifiers.rainbow = Roact.createElement("ImageLabel", {
            BackgroundTransparency = 1,
            Image = "rbxassetid://3213669223",
            Size = UDim2.new(0,16,0,16),
        })
    end

    local modifiersFrame = Roact.createElement("Frame",{
        BackgroundTransparency = 1,
        Size = UDim2.new(1,-8,0,16),
        Position = UDim2.new(1,-4,0,4),
        AnchorPoint = Vector2.new(1,0),
    }, modifiers)

    children.padding = Roact.createElement("UIPadding", {
        PaddingLeft = UDim.new(0,8),
        PaddingTop = UDim.new(0,8),
        PaddingRight = UDim.new(0,8),
        PaddingBottom = UDim.new(0,8),
    })

    children.gamutGrid = Roact.createElement("ImageLabel", {
        Size = UDim2.new(1,0,1,0),
        Image = "rbxassetid://711821509",
        ScaleType = Enum.ScaleType.Tile,
        TileSize = UDim2.new(0,256,0,256),
        BorderColor3 = hovered and Color3.fromRGB(204, 204, 204) or Color3.fromRGB(230, 230, 230),
        ImageColor3 = Color3.fromRGB(223, 223, 223),
        BackgroundColor3 = Color3.fromRGB(255,255,255),
    }, {
        viewport = Roact.createElement(ModelViewFrame, {
            model = getAssetModel(self.props.asset.id),
            Size = UDim2.new(1,0,1,0),
            ImageColor3 = self.props.blackout and Color3.new(0,0,0) or Color3.new(1,1,1)
        }, {
            isEquipped = checkmark,
            modifiers = modifiersFrame,
            thumbnailImage = thumbnailImage,
        })
    })
    return Roact.createElement("TextButton", {
        BackgroundColor3 = hovered and Color3.fromRGB(223, 223, 223) or Color3.fromRGB(255,255,255),
        BorderColor3 = hovered and Color3.fromRGB(204, 204, 204) or Color3.fromRGB(230, 230, 230),
        AutoButtonColor = false,
        LayoutOrder = self.props.LayoutOrder or 0,
        Text = "",
        [Roact.Event.MouseButton1Click] = function()
            self.props.onClick(self.props.asset.id,self.props.equipped)
        end,

        [Roact.Event.MouseEnter] = function()
            self:setState( function() return {
                hovered = true,
            } end)
        end,

        [Roact.Event.MouseLeave] = function()
            self:setState( function() return {
                hovered = false,
            } end)
        end,
    }, children)
end

local function mapStateToProps(state, props)
    return {
        equipped = Selectors.isEquipped(state, LocalPlayer, props.asset.id)
    }
end

AssetButton = RoactRodux.connect(mapStateToProps,nil)(AssetButton)
return AssetButton