refactor: moved components to separate modules

`content.ts` is now half less than the size, exported functions can be unit tested

src/content/uiRenderer.ts

@@ -0,0 +1,33 @@
+import { ItemPriceData } from "./priceService";
+import { formatPrice } from "./utils/formatting";
+import { $T } from "./utils/localization";
+
+export function createPriceRow(qualityName: string, data: ItemPriceData, keyPrice: ItemPriceData, locale: string): HTMLTableRowElement {
+  const priceRow = document.createElement("tr");
+
+  const priceLabel = document.createElement("td");
+  priceLabel.className = "infobox-label";
+  const priceLabelLink = document.createElement("a");
+  priceLabelLink.href = locale === 'en' ? `https://wiki.teamfortress.com/wiki/${qualityName}` : `https://wiki.teamfortress.com/wiki/${qualityName}/${locale}` 
+  priceLabelLink.innerText = $T(qualityName)
+  priceLabel.appendChild(priceLabelLink);
+  priceLabel.innerHTML += ':'
+  priceRow.appendChild(priceLabel);
+
+  const priceData = document.createElement("td");
+  const priceLink = document.createElement("span");
+  const priceString = data ? formatPrice(data.keys, data.metal, keyPrice.metal, locale).trim() : $T('Data unavailable')
+  priceLink.innerHTML = priceString // + `<br>$${data.scmPrice}`
+  priceData.appendChild(priceLink);
+  priceRow.appendChild(priceData);
+  return priceRow;
+}
+
+export function createStoreButton(storeName: string, url: URL) {
+	const button = document.createElement("tr")
+	var source = `<td colspan="2" class="infobox-data" style="text-align:center"><div class="plainlinks btn_wrapper" style="width:100%"><a rel="nofollow" class="external text" href="{link}" target="_blank"><span class="btn_buynow_addon_${storeName.replaceAll('.', '')}">{title}<span></span></span></a></div></td>`
+	source = source.replace("{link}", url.toString())
+	source = source.replace("{title}", $T("View listings on %@").replace('%@', storeName))
+	button.innerHTML = source
+	return button
+}