src/StarterGui/ShopGUI.client.lua

-- src/StarterGui/ShopGUI.client.lua
-- Scrollable shop interface opened via P key or NPC interaction

local Players = game:GetService("Players")
local UserInputService = game:GetService("UserInputService")
local ReplicatedStorage = game:GetService("ReplicatedStorage")

local player = Players.LocalPlayer
local ShopConfig = require(ReplicatedStorage:WaitForChild("Shared"):WaitForChild("ShopConfig"))
local Utility = require(ReplicatedStorage:WaitForChild("Shared"):WaitForChild("Utility"))
local PurchaseEvent = ReplicatedStorage:WaitForChild("Events"):WaitForChild("PurchaseEvent")
local ShopEvent = ReplicatedStorage:WaitForChild("Events"):WaitForChild("ShopEvent")

-- Create ScreenGui
local screenGui = Instance.new("ScreenGui")
screenGui.Name = "ShopGUI"
screenGui.ResetOnSpawn = false
screenGui.Parent = player:WaitForChild("PlayerGui")

-- Main Frame (hidden by default)
local mainFrame = Instance.new("Frame")
mainFrame.Name = "ShopFrame"
mainFrame.Size = UDim2.new(0, 500, 0, 450)
mainFrame.Position = UDim2.new(0.5, -250, 0.5, -225)
mainFrame.BackgroundColor3 = Color3.fromRGB(25, 30, 35)
mainFrame.BackgroundTransparency = 0.05
mainFrame.BorderSizePixel = 0
mainFrame.Visible = false
mainFrame.Parent = screenGui

local frameCorner = Instance.new("UICorner")
frameCorner.CornerRadius = UDim.new(0, 12)
frameCorner.Parent = mainFrame

local frameStroke = Instance.new("UIStroke")
frameStroke.Color = Color3.fromRGB(80, 160, 80)
frameStroke.Thickness = 2
frameStroke.Parent = mainFrame

-- Title bar
local titleBar = Instance.new("Frame")
titleBar.Size = UDim2.new(1, 0, 0, 45)
titleBar.BackgroundColor3 = Color3.fromRGB(40, 100, 40)
titleBar.BorderSizePixel = 0
titleBar.Parent = mainFrame

local titleCorner = Instance.new("UICorner")
titleCorner.CornerRadius = UDim.new(0, 12)
titleCorner.Parent = titleBar

local titleLabel = Instance.new("TextLabel")
titleLabel.Size = UDim2.new(1, -50, 1, 0)
titleLabel.Position = UDim2.new(0, 15, 0, 0)
titleLabel.BackgroundTransparency = 1
titleLabel.Text = "Sue's Supply Shop"
titleLabel.TextColor3 = Color3.new(1, 1, 1)
titleLabel.TextScaled = true
titleLabel.Font = Enum.Font.GothamBold
titleLabel.TextXAlignment = Enum.TextXAlignment.Left
titleLabel.Parent = titleBar

-- Close button
local closeBtn = Instance.new("TextButton")
closeBtn.Size = UDim2.new(0, 35, 0, 35)
closeBtn.Position = UDim2.new(1, -40, 0, 5)
closeBtn.BackgroundColor3 = Color3.fromRGB(180, 50, 50)
closeBtn.Text = "X"
closeBtn.TextColor3 = Color3.new(1, 1, 1)
closeBtn.TextScaled = true
closeBtn.Font = Enum.Font.GothamBold
closeBtn.Parent = titleBar

local closeBtnCorner = Instance.new("UICorner")
closeBtnCorner.CornerRadius = UDim.new(0, 6)
closeBtnCorner.Parent = closeBtn

closeBtn.MouseButton1Click:Connect(function()
	mainFrame.Visible = false
end)

-- Category tabs
local tabFrame = Instance.new("Frame")
tabFrame.Size = UDim2.new(1, -20, 0, 30)
tabFrame.Position = UDim2.new(0, 10, 0, 50)
tabFrame.BackgroundTransparency = 1
tabFrame.Parent = mainFrame

local tabLayout = Instance.new("UIListLayout")
tabLayout.FillDirection = Enum.FillDirection.Horizontal
tabLayout.SortOrder = Enum.SortOrder.LayoutOrder
tabLayout.Padding = UDim.new(0, 4)
tabLayout.Parent = tabFrame

-- Scroll frame for items
local scrollFrame = Instance.new("ScrollingFrame")
scrollFrame.Name = "ItemsScroll"
scrollFrame.Size = UDim2.new(1, -20, 1, -100)
scrollFrame.Position = UDim2.new(0, 10, 0, 85)
scrollFrame.BackgroundColor3 = Color3.fromRGB(15, 18, 22)
scrollFrame.BorderSizePixel = 0
scrollFrame.ScrollBarThickness = 6
scrollFrame.CanvasSize = UDim2.new(0, 0, 0, 0)
scrollFrame.Parent = mainFrame

local scrollCorner = Instance.new("UICorner")
scrollCorner.CornerRadius = UDim.new(0, 8)
scrollCorner.Parent = scrollFrame

local gridLayout = Instance.new("UIGridLayout")
gridLayout.CellSize = UDim2.new(0, 220, 0, 80)
gridLayout.CellPadding = UDim2.new(0, 8, 0, 8)
gridLayout.SortOrder = Enum.SortOrder.LayoutOrder
gridLayout.Parent = scrollFrame

local scrollPadding = Instance.new("UIPadding")
scrollPadding.PaddingTop = UDim.new(0, 5)
scrollPadding.PaddingLeft = UDim.new(0, 5)
scrollPadding.Parent = scrollFrame

local currentCategory = "Tool"

local function createItemCard(itemId, itemData, layoutOrder)
	local card = Instance.new("Frame")
	card.Name = itemId
	card.LayoutOrder = layoutOrder
	card.BackgroundColor3 = Color3.fromRGB(35, 40, 48)
	card.BorderSizePixel = 0

	local cardCorner = Instance.new("UICorner")
	cardCorner.CornerRadius = UDim.new(0, 8)
	cardCorner.Parent = card

	local nameLabel = Instance.new("TextLabel")
	nameLabel.Size = UDim2.new(1, -10, 0, 20)
	nameLabel.Position = UDim2.new(0, 5, 0, 5)
	nameLabel.BackgroundTransparency = 1
	nameLabel.Text = itemData.Name
	nameLabel.TextColor3 = Color3.new(1, 1, 1)
	nameLabel.TextScaled = true
	nameLabel.Font = Enum.Font.GothamBold
	nameLabel.TextXAlignment = Enum.TextXAlignment.Left
	nameLabel.Parent = card

	local descLabel = Instance.new("TextLabel")
	descLabel.Size = UDim2.new(1, -10, 0, 15)
	descLabel.Position = UDim2.new(0, 5, 0, 25)
	descLabel.BackgroundTransparency = 1
	descLabel.Text = itemData.Description or ""
	descLabel.TextColor3 = Color3.fromRGB(180, 180, 180)
	descLabel.TextScaled = true
	descLabel.Font = Enum.Font.Gotham
	descLabel.TextXAlignment = Enum.TextXAlignment.Left
	descLabel.Parent = card

	local buyBtn = Instance.new("TextButton")
	buyBtn.Size = UDim2.new(0, 90, 0, 25)
	buyBtn.Position = UDim2.new(1, -95, 1, -30)
	buyBtn.BackgroundColor3 = itemData.Price == 0 and Color3.fromRGB(100, 100, 100) or Color3.fromRGB(60, 140, 60)
	buyBtn.Text = itemData.Price == 0 and "FREE" or Utility.formatCash(itemData.Price)
	buyBtn.TextColor3 = Color3.new(1, 1, 1)
	buyBtn.TextScaled = true
	buyBtn.Font = Enum.Font.GothamBold
	buyBtn.Parent = card

	local btnCorner = Instance.new("UICorner")
	btnCorner.CornerRadius = UDim.new(0, 6)
	btnCorner.Parent = buyBtn

	buyBtn.MouseButton1Click:Connect(function()
		PurchaseEvent:FireServer(itemId)
	end)

	card.Parent = scrollFrame
end

local function populateCategory(category)
	currentCategory = category

	-- Clear existing items
	for _, child in pairs(scrollFrame:GetChildren()) do
		if child:IsA("Frame") then
			child:Destroy()
		end
	end

	-- Populate items for this category
	local items = ShopConfig.CategoryItems[category] or {}
	for i, itemId in ipairs(items) do
		local itemData = ShopConfig.Items[itemId]
		if itemData then
			createItemCard(itemId, itemData, i)
		end
	end

	-- Update canvas size
	task.wait()
	scrollFrame.CanvasSize = UDim2.new(0, 0, 0, gridLayout.AbsoluteContentSize.Y + 15)
end

-- Create category tabs
for i, category in ipairs(ShopConfig.Categories) do
	local tab = Instance.new("TextButton")
	tab.Name = category
	tab.Size = UDim2.new(0, 65, 1, 0)
	tab.LayoutOrder = i
	tab.BackgroundColor3 = Color3.fromRGB(50, 55, 65)
	tab.Text = category
	tab.TextColor3 = Color3.new(1, 1, 1)
	tab.TextScaled = true
	tab.Font = Enum.Font.GothamMedium
	tab.Parent = tabFrame

	local tabCorner = Instance.new("UICorner")
	tabCorner.CornerRadius = UDim.new(0, 6)
	tabCorner.Parent = tab

	tab.MouseButton1Click:Connect(function()
		-- Highlight active tab
		for _, sibling in pairs(tabFrame:GetChildren()) do
			if sibling:IsA("TextButton") then
				sibling.BackgroundColor3 = Color3.fromRGB(50, 55, 65)
			end
		end
		tab.BackgroundColor3 = Color3.fromRGB(40, 100, 40)

		populateCategory(category)
	end)
end

-- Initialize with first category
populateCategory("Tool")

-- Toggle shop with P key
UserInputService.InputBegan:Connect(function(input, gameProcessed)
	if gameProcessed then return end
	if input.KeyCode == Enum.KeyCode.P then
		mainFrame.Visible = not mainFrame.Visible
	end
end)

-- Handle NPC shop open event
ShopEvent.OnClientEvent:Connect(function(action, data)
	if action == "OpenShop" then
		mainFrame.Visible = true
	end
end)