{"id":66,"date":"2026-03-26T01:35:51","date_gmt":"2026-03-26T01:35:51","guid":{"rendered":"https:\/\/checklist.tradefxclusive.co.za\/?page_id=66"},"modified":"2026-03-26T01:51:36","modified_gmt":"2026-03-26T01:51:36","slug":"history","status":"publish","type":"page","link":"https:\/\/checklist.tradefxclusive.co.za\/?page_id=66","title":{"rendered":"History"},"content":{"rendered":"\n<div class=\"tpt-history-shell\">\n  <div class=\"tpt-history-hero\">\n    <div class=\"tpt-history-hero-badge\">Trade Journal<\/div>\n    <h1>Trade History<\/h1>\n    <p>Review, update and complete your saved trades from The Perfect Trade checklist.<\/p>\n  <\/div>\n\n  <div class=\"tpt-history-toolbar\">\n    <div class=\"tpt-history-toolbar-left\">\n      <div class=\"tpt-stat-card\">\n        <span>Total Saved Trades<\/span>\n        <strong id=\"tptHistoryCount\">0<\/strong>\n      <\/div>\n    <\/div>\n\n    <div class=\"tpt-history-toolbar-right\">\n      <div class=\"tpt-filter-group\">\n        <label for=\"tptFilterType\">Trade Type<\/label>\n        <div class=\"tpt-select-wrap\">\n          <select id=\"tptFilterType\">\n            <option value=\"all\">All Trade Types<\/option>\n            <option value=\"swing\">Swing Trade<\/option>\n            <option value=\"day\">Day Trade<\/option>\n            <option value=\"scalp\">Scalp Trade<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <div class=\"tpt-filter-group\">\n        <label for=\"tptFilterDirection\">Direction<\/label>\n        <div class=\"tpt-select-wrap\">\n          <select id=\"tptFilterDirection\">\n            <option value=\"all\">All Directions<\/option>\n            <option value=\"LONG\">Long<\/option>\n            <option value=\"SHORT\">Short<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <div class=\"tpt-filter-group\">\n        <label for=\"tptFilterResult\">Result<\/label>\n        <div class=\"tpt-select-wrap\">\n          <select id=\"tptFilterResult\">\n            <option value=\"all\">All Results<\/option>\n            <option value=\"open\">Open<\/option>\n            <option value=\"win\">Win<\/option>\n            <option value=\"loss\">Loss<\/option>\n            <option value=\"breakeven\">Breakeven<\/option>\n          <\/select>\n        <\/div>\n      <\/div>\n\n      <button type=\"button\" id=\"tptClearHistoryBtn\" class=\"tpt-clear-btn\">\n        Clear All\n      <\/button>\n    <\/div>\n  <\/div>\n\n  <div id=\"tptHistoryEmpty\" class=\"tpt-history-empty\" style=\"display:none;\">\n    <div class=\"tpt-empty-icon\">\ud83d\udcc8<\/div>\n    <h2>No saved trades yet<\/h2>\n    <p>Your saved trades will appear here once you use the Save Trade popup.<\/p>\n  <\/div>\n\n  <div id=\"tptHistoryGrid\" class=\"tpt-history-grid\"><\/div>\n<\/div>\n\n<style>\n  .tpt-history-shell {\n    max-width: 1400px;\n    margin: 40px auto;\n    padding: 24px;\n    color: #f8fafc;\n    font-family: Arial, sans-serif;\n  }\n\n  .tpt-history-hero {\n    text-align: center;\n    margin-bottom: 28px;\n    padding: 38px 26px;\n    border-radius: 28px;\n    background:\n      radial-gradient(circle at top left, rgba(34,230,168,0.16), transparent 30%),\n      radial-gradient(circle at top right, rgba(59,130,246,0.14), transparent 30%),\n      linear-gradient(180deg, #0d1830 0%, #091326 100%);\n    border: 1px solid rgba(255,255,255,0.08);\n    box-shadow: 0 18px 50px rgba(0,0,0,0.28);\n  }\n\n  .tpt-history-hero-badge {\n    display: inline-block;\n    margin-bottom: 14px;\n    padding: 9px 16px;\n    border-radius: 999px;\n    background: rgba(34,230,168,0.12);\n    border: 1px solid rgba(34,230,168,0.18);\n    color: #22e6a8;\n    font-size: 13px;\n    font-weight: 800;\n    letter-spacing: 0.4px;\n    text-transform: uppercase;\n  }\n\n  .tpt-history-hero h1 {\n    margin: 0 0 10px;\n    font-size: 56px;\n    line-height: 1.05;\n    font-weight: 900;\n    color: #ffffff;\n  }\n\n  .tpt-history-hero p {\n    margin: 0;\n    color: #94a3b8;\n    font-size: 17px;\n  }\n\n  .tpt-history-toolbar {\n    display: flex;\n    align-items: end;\n    justify-content: space-between;\n    gap: 16px;\n    flex-wrap: wrap;\n    margin-bottom: 28px;\n  }\n\n  .tpt-history-toolbar-left,\n  .tpt-history-toolbar-right {\n    display: flex;\n    gap: 14px;\n    flex-wrap: wrap;\n    align-items: end;\n  }\n\n  .tpt-stat-card {\n    min-width: 220px;\n    padding: 18px 20px;\n    border-radius: 18px;\n    background: linear-gradient(180deg, #13203a 0%, #0f1a31 100%);\n    border: 1px solid rgba(255,255,255,0.08);\n    box-shadow: 0 10px 28px rgba(0,0,0,0.2);\n  }\n\n  .tpt-stat-card span {\n    display: block;\n    font-size: 13px;\n    font-weight: 700;\n    color: #94a3b8;\n    margin-bottom: 8px;\n    text-transform: uppercase;\n    letter-spacing: 0.4px;\n  }\n\n  .tpt-stat-card strong {\n    display: block;\n    font-size: 32px;\n    line-height: 1;\n    font-weight: 900;\n    color: #ffffff;\n  }\n\n  .tpt-filter-group {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  .tpt-filter-group label {\n    font-size: 12px;\n    color: #94a3b8;\n    font-weight: 800;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n    padding-left: 2px;\n  }\n\n  .tpt-select-wrap {\n    position: relative;\n  }\n\n  .tpt-select-wrap::after {\n    content: \"\u25be\";\n    position: absolute;\n    right: 14px;\n    top: 50%;\n    transform: translateY(-50%);\n    color: #94a3b8;\n    pointer-events: none;\n    font-size: 14px;\n  }\n\n  .tpt-select-wrap select {\n    appearance: none;\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    min-width: 210px;\n    width: 210px;\n    padding: 14px 42px 14px 14px;\n    border-radius: 14px;\n    border: 1px solid rgba(255,255,255,0.08);\n    background: linear-gradient(180deg, #16233f 0%, #121d35 100%);\n    color: #ffffff;\n    font-size: 14px;\n    font-weight: 700;\n    outline: none;\n    box-shadow: 0 8px 22px rgba(0,0,0,0.16);\n  }\n\n  .tpt-select-wrap select:focus {\n    border-color: rgba(34,230,168,0.4);\n    box-shadow: 0 0 0 3px rgba(34,230,168,0.08);\n  }\n\n  .tpt-clear-btn {\n    padding: 14px 18px;\n    border: none;\n    border-radius: 14px;\n    background: linear-gradient(90deg, #ef4444 0%, #f97316 100%);\n    color: #ffffff;\n    font-size: 14px;\n    font-weight: 800;\n    cursor: pointer;\n    box-shadow: 0 10px 24px rgba(239,68,68,0.22);\n  }\n\n  .tpt-history-empty {\n    text-align: center;\n    padding: 64px 20px;\n    border-radius: 26px;\n    background: linear-gradient(180deg, #13203a 0%, #0f1a31 100%);\n    border: 1px solid rgba(255,255,255,0.08);\n    box-shadow: 0 14px 40px rgba(0,0,0,0.22);\n  }\n\n  .tpt-empty-icon {\n    font-size: 56px;\n    margin-bottom: 16px;\n  }\n\n  .tpt-history-empty h2 {\n    margin: 0 0 10px;\n    font-size: 30px;\n    font-weight: 900;\n    color: #ffffff;\n  }\n\n  .tpt-history-empty p {\n    margin: 0;\n    font-size: 15px;\n    color: #94a3b8;\n  }\n\n  .tpt-history-grid {\n    display: grid;\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n    gap: 20px;\n  }\n\n  .tpt-history-card {\n    border-radius: 24px;\n    background:\n      radial-gradient(circle at top right, rgba(34,230,168,0.06), transparent 22%),\n      linear-gradient(180deg, #13203a 0%, #0f1a31 100%);\n    border: 1px solid rgba(255,255,255,0.08);\n    box-shadow: 0 16px 40px rgba(0,0,0,0.25);\n    overflow: hidden;\n  }\n\n  .tpt-history-card-head {\n    padding: 22px 22px 18px;\n  }\n\n  .tpt-history-card-top {\n    display: flex;\n    justify-content: space-between;\n    gap: 14px;\n    align-items: flex-start;\n    margin-bottom: 18px;\n  }\n\n  .tpt-history-title {\n    margin: 0 0 8px;\n    font-size: 28px;\n    font-weight: 900;\n    line-height: 1.05;\n    color: #ffffff;\n  }\n\n  .tpt-history-subtext {\n    color: #94a3b8;\n    font-size: 13px;\n    font-weight: 700;\n  }\n\n  .tpt-history-badges {\n    display: flex;\n    gap: 8px;\n    flex-wrap: wrap;\n    justify-content: flex-end;\n  }\n\n  .tpt-badge {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    min-height: 34px;\n    padding: 7px 12px;\n    border-radius: 999px;\n    font-size: 12px;\n    font-weight: 900;\n    letter-spacing: 0.2px;\n    white-space: nowrap;\n    border: 1px solid transparent;\n  }\n\n  .tpt-badge-type {\n    background: rgba(59,130,246,0.15);\n    color: #93c5fd;\n    border-color: rgba(147,197,253,0.14);\n  }\n\n  .tpt-badge-long {\n    background: rgba(16,185,129,0.15);\n    color: #22e6a8;\n    border-color: rgba(34,230,168,0.14);\n  }\n\n  .tpt-badge-short {\n    background: rgba(239,68,68,0.15);\n    color: #fca5a5;\n    border-color: rgba(252,165,165,0.14);\n  }\n\n  .tpt-badge-score {\n    background: rgba(168,85,247,0.15);\n    color: #d8b4fe;\n    border-color: rgba(216,180,254,0.14);\n  }\n\n  .tpt-badge-open {\n    background: rgba(148,163,184,0.14);\n    color: #cbd5e1;\n    border-color: rgba(203,213,225,0.12);\n  }\n\n  .tpt-badge-win {\n    background: rgba(16,185,129,0.18);\n    color: #22e6a8;\n    border-color: rgba(34,230,168,0.18);\n  }\n\n  .tpt-badge-loss {\n    background: rgba(239,68,68,0.18);\n    color: #fca5a5;\n    border-color: rgba(252,165,165,0.18);\n  }\n\n  .tpt-badge-breakeven {\n    background: rgba(245,158,11,0.18);\n    color: #fcd34d;\n    border-color: rgba(252,211,77,0.18);\n  }\n\n  .tpt-history-quick {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 12px;\n  }\n\n  .tpt-history-quick-box {\n    border-radius: 16px;\n    padding: 14px;\n    background: rgba(255,255,255,0.035);\n    border: 1px solid rgba(255,255,255,0.05);\n  }\n\n  .tpt-history-quick-box span {\n    display: block;\n    font-size: 11px;\n    font-weight: 800;\n    color: #94a3b8;\n    text-transform: uppercase;\n    letter-spacing: 0.4px;\n    margin-bottom: 8px;\n  }\n\n  .tpt-history-quick-box strong {\n    display: block;\n    font-size: 17px;\n    color: #ffffff;\n    font-weight: 900;\n    word-break: break-word;\n  }\n\n  .tpt-history-card-footer {\n    padding: 0 22px 22px;\n  }\n\n  .tpt-history-expand-btn {\n    width: 100%;\n    border: none;\n    border-radius: 14px;\n    padding: 15px 18px;\n    font-size: 14px;\n    font-weight: 900;\n    cursor: pointer;\n    color: #ffffff;\n    background: linear-gradient(90deg, #10b981 0%, #22e6a8 100%);\n    box-shadow: 0 10px 24px rgba(16,185,129,0.22);\n  }\n\n  .tpt-history-expandable {\n    display: none;\n    border-top: 1px solid rgba(255,255,255,0.06);\n    padding: 22px;\n    background: rgba(0,0,0,0.08);\n  }\n\n  .tpt-history-card.open .tpt-history-expandable {\n    display: block;\n  }\n\n  .tpt-history-card.open .tpt-history-expand-btn {\n    background: linear-gradient(90deg, #334155 0%, #475569 100%);\n    box-shadow: none;\n  }\n\n  .tpt-history-section {\n    margin-bottom: 22px;\n  }\n\n  .tpt-history-section:last-child {\n    margin-bottom: 0;\n  }\n\n  .tpt-history-section-title {\n    font-size: 13px;\n    font-weight: 900;\n    color: #ffffff;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n    margin-bottom: 12px;\n  }\n\n  .tpt-history-details {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 12px;\n  }\n\n  .tpt-history-detail {\n    border-radius: 14px;\n    padding: 14px;\n    background: rgba(255,255,255,0.035);\n    border: 1px solid rgba(255,255,255,0.05);\n  }\n\n  .tpt-history-detail span {\n    display: block;\n    font-size: 11px;\n    color: #94a3b8;\n    margin-bottom: 8px;\n    font-weight: 800;\n    text-transform: uppercase;\n    letter-spacing: 0.4px;\n  }\n\n  .tpt-history-detail strong {\n    display: block;\n    font-size: 15px;\n    color: #ffffff;\n    font-weight: 900;\n    word-break: break-word;\n  }\n\n  .tpt-outcome-grid {\n    display: grid;\n    grid-template-columns: 1.2fr 1fr;\n    gap: 14px;\n  }\n\n  .tpt-history-field label {\n    display: block;\n    font-size: 11px;\n    color: #94a3b8;\n    margin-bottom: 8px;\n    font-weight: 900;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n  }\n\n  .tpt-history-field select,\n  .tpt-history-field input,\n  .tpt-history-notes-area {\n    width: 100%;\n    box-sizing: border-box;\n    border: 1px solid rgba(255,255,255,0.08);\n    background: #16233f;\n    color: #ffffff;\n    border-radius: 14px;\n    padding: 14px 14px;\n    font-size: 14px;\n    font-weight: 700;\n    outline: none;\n  }\n\n  .tpt-history-field select {\n    appearance: none;\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    min-height: 50px;\n  }\n\n  .tpt-history-field input:focus,\n  .tpt-history-field select:focus,\n  .tpt-history-notes-area:focus {\n    border-color: rgba(34,230,168,0.4);\n    box-shadow: 0 0 0 3px rgba(34,230,168,0.08);\n  }\n\n  .tpt-history-notes-area {\n    min-height: 130px;\n    resize: vertical;\n    line-height: 1.6;\n  }\n\n  .tpt-history-actions {\n    display: flex;\n    justify-content: space-between;\n    gap: 12px;\n    flex-wrap: wrap;\n    margin-top: 16px;\n  }\n\n  .tpt-history-left-actions,\n  .tpt-history-right-actions {\n    display: flex;\n    gap: 10px;\n    flex-wrap: wrap;\n  }\n\n  .tpt-action-btn {\n    border: none;\n    border-radius: 12px;\n    padding: 13px 16px;\n    font-size: 13px;\n    font-weight: 900;\n    cursor: pointer;\n    transition: 0.2s ease;\n  }\n\n  .tpt-save-btn {\n    background: linear-gradient(90deg, #10b981 0%, #22e6a8 100%);\n    color: #ffffff;\n    box-shadow: 0 10px 24px rgba(16,185,129,0.2);\n  }\n\n  .tpt-delete-btn {\n    background: rgba(239,68,68,0.14);\n    color: #fca5a5;\n    border: 1px solid rgba(252,165,165,0.18);\n  }\n\n  .tpt-close-btn {\n    background: #1d2843;\n    color: #ffffff;\n    border: 1px solid rgba(255,255,255,0.08);\n  }\n\n  .tpt-profit-positive {\n    color: #22e6a8 !important;\n  }\n\n  .tpt-profit-negative {\n    color: #fca5a5 !important;\n  }\n\n  .tpt-profit-neutral {\n    color: #fcd34d !important;\n  }\n\n  @media (max-width: 1100px) {\n    .tpt-history-grid {\n      grid-template-columns: 1fr;\n    }\n\n    .tpt-history-hero h1 {\n      font-size: 42px;\n    }\n  }\n\n  @media (max-width: 780px) {\n    .tpt-history-shell {\n      padding: 14px;\n    }\n\n    .tpt-history-hero {\n      padding: 28px 18px;\n      border-radius: 20px;\n    }\n\n    .tpt-history-hero h1 {\n      font-size: 34px;\n    }\n\n    .tpt-history-toolbar {\n      align-items: stretch;\n    }\n\n    .tpt-history-toolbar-right,\n    .tpt-history-toolbar-left {\n      width: 100%;\n    }\n\n    .tpt-filter-group,\n    .tpt-select-wrap,\n    .tpt-select-wrap select,\n    .tpt-clear-btn,\n    .tpt-stat-card {\n      width: 100%;\n    }\n\n    .tpt-history-card-top {\n      flex-direction: column;\n    }\n\n    .tpt-history-badges {\n      justify-content: flex-start;\n    }\n\n    .tpt-history-quick,\n    .tpt-history-details,\n    .tpt-outcome-grid {\n      grid-template-columns: 1fr;\n    }\n\n    .tpt-history-actions {\n      flex-direction: column;\n    }\n\n    .tpt-history-left-actions,\n    .tpt-history-right-actions {\n      width: 100%;\n    }\n\n    .tpt-action-btn {\n      width: 100%;\n    }\n  }\n<\/style>\n\n<script>\n(function () {\n  const STORAGE_KEY = 'tptTradeHistory';\n\n  const historyGrid = document.getElementById('tptHistoryGrid');\n  const historyEmpty = document.getElementById('tptHistoryEmpty');\n  const historyCount = document.getElementById('tptHistoryCount');\n  const filterType = document.getElementById('tptFilterType');\n  const filterDirection = document.getElementById('tptFilterDirection');\n  const filterResult = document.getElementById('tptFilterResult');\n  const clearHistoryBtn = document.getElementById('tptClearHistoryBtn');\n\n  function getTrades() {\n    const trades = JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]');\n    return trades.map(trade => ({\n      ...trade,\n      result: trade.result || 'open',\n      profitLoss: trade.profitLoss || ''\n    }));\n  }\n\n  function saveTrades(trades) {\n    localStorage.setItem(STORAGE_KEY, JSON.stringify(trades));\n  }\n\n  function formatTradeType(type) {\n    if (type === 'swing') return 'Swing Trade';\n    if (type === 'day') return 'Day Trade';\n    if (type === 'scalp') return 'Scalp Trade';\n    return type || 'Trade';\n  }\n\n  function formatDate(dateString) {\n    const date = new Date(dateString);\n    if (isNaN(date.getTime())) return 'Unknown date';\n    return date.toLocaleString([], {\n      year: 'numeric',\n      month: 'short',\n      day: 'numeric',\n      hour: '2-digit',\n      minute: '2-digit'\n    });\n  }\n\n  function getResultLabel(result) {\n    if (result === 'win') return 'Win';\n    if (result === 'loss') return 'Loss';\n    if (result === 'breakeven') return 'Breakeven';\n    return 'Open';\n  }\n\n  function getResultBadgeClass(result) {\n    if (result === 'win') return 'tpt-badge-win';\n    if (result === 'loss') return 'tpt-badge-loss';\n    if (result === 'breakeven') return 'tpt-badge-breakeven';\n    return 'tpt-badge-open';\n  }\n\n  function getDirectionBadgeClass(direction) {\n    return direction === 'LONG' ? 'tpt-badge-long' : 'tpt-badge-short';\n  }\n\n  function formatMoney(value) {\n    if (value === null || value === undefined || value === '') return '\u2014';\n    const number = Number(value);\n    if (Number.isNaN(number)) return value;\n    return '$' + number.toLocaleString(undefined, { minimumFractionDigits: 0, maximumFractionDigits: 2 });\n  }\n\n  function getProfitLossClass(value, result) {\n    const number = Number(value);\n    if (result === 'win' || number > 0) return 'tpt-profit-positive';\n    if (result === 'loss' || number < 0) return 'tpt-profit-negative';\n    return 'tpt-profit-neutral';\n  }\n\n  function renderTrades() {\n    const trades = getTrades();\n    const selectedType = filterType.value;\n    const selectedDirection = filterDirection.value;\n    const selectedResult = filterResult.value;\n\n    const filteredTrades = trades.filter(trade => {\n      const typeMatch = selectedType === 'all' || trade.tradeType === selectedType;\n      const directionMatch = selectedDirection === 'all' || trade.direction === selectedDirection;\n      const resultMatch = selectedResult === 'all' || trade.result === selectedResult;\n      return typeMatch && directionMatch && resultMatch;\n    });\n\n    historyCount.textContent = filteredTrades.length.toString();\n\n    if (!filteredTrades.length) {\n      historyGrid.innerHTML = '';\n      historyEmpty.style.display = 'block';\n      return;\n    }\n\n    historyEmpty.style.display = 'none';\n\n    historyGrid.innerHTML = filteredTrades.map(trade => {\n      const profitClass = getProfitLossClass(trade.profitLoss, trade.result);\n\n      return `\n        <div class=\"tpt-history-card\" data-id=\"${trade.id}\">\n          <div class=\"tpt-history-card-head\">\n            <div class=\"tpt-history-card-top\">\n              <div>\n                <h2 class=\"tpt-history-title\">${trade.currencyPair || 'N\/A'}<\/h2>\n                <div class=\"tpt-history-subtext\">${formatDate(trade.createdAt)}<\/div>\n              <\/div>\n\n              <div class=\"tpt-history-badges\">\n                <div class=\"tpt-badge tpt-badge-type\">${formatTradeType(trade.tradeType)}<\/div>\n                <div class=\"tpt-badge ${getDirectionBadgeClass(trade.direction)}\">${trade.direction || 'N\/A'}<\/div>\n                <div class=\"tpt-badge tpt-badge-score\">${trade.confluenceScore || '0%'}<\/div>\n                <div class=\"tpt-badge ${getResultBadgeClass(trade.result)}\">${getResultLabel(trade.result)}<\/div>\n              <\/div>\n            <\/div>\n\n            <div class=\"tpt-history-quick\">\n              <div class=\"tpt-history-quick-box\">\n                <span>Entry<\/span>\n                <strong>${trade.entryPrice || '\u2014'}<\/strong>\n              <\/div>\n              <div class=\"tpt-history-quick-box\">\n                <span>Risk<\/span>\n                <strong>${trade.riskPercentage ? trade.riskPercentage + '%' : '\u2014'}<\/strong>\n              <\/div>\n              <div class=\"tpt-history-quick-box\">\n                <span>P\/L<\/span>\n                <strong class=\"${profitClass}\">${trade.profitLoss !== '' ? formatMoney(trade.profitLoss) : '\u2014'}<\/strong>\n              <\/div>\n            <\/div>\n          <\/div>\n\n          <div class=\"tpt-history-card-footer\">\n            <button type=\"button\" class=\"tpt-history-expand-btn\" data-expand-id=\"${trade.id}\">\n              Open Trade Details\n            <\/button>\n          <\/div>\n\n          <div class=\"tpt-history-expandable\" id=\"tpt-expand-${trade.id}\">\n            <div class=\"tpt-history-section\">\n              <div class=\"tpt-history-section-title\">Full Trade Details<\/div>\n              <div class=\"tpt-history-details\">\n                <div class=\"tpt-history-detail\">\n                  <span>Currency Pair<\/span>\n                  <strong>${trade.currencyPair || '\u2014'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Direction<\/span>\n                  <strong>${trade.direction || '\u2014'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Trade Type<\/span>\n                  <strong>${formatTradeType(trade.tradeType)}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Confluence Score<\/span>\n                  <strong>${trade.confluenceScore || '0%'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Account Balance<\/span>\n                  <strong>${formatMoney(trade.accountBalance)}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Risk Percentage<\/span>\n                  <strong>${trade.riskPercentage ? trade.riskPercentage + '%' : '\u2014'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Entry Price<\/span>\n                  <strong>${trade.entryPrice || '\u2014'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Stop Loss<\/span>\n                  <strong>${trade.stopLoss || '\u2014'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Take Profit<\/span>\n                  <strong>${trade.takeProfit || '\u2014'}<\/strong>\n                <\/div>\n                <div class=\"tpt-history-detail\">\n                  <span>Chart Image<\/span>\n                  <strong>${trade.chartImageName || '\u2014'}<\/strong>\n                <\/div>\n              <\/div>\n            <\/div>\n\n            <div class=\"tpt-history-section\">\n              <div class=\"tpt-history-section-title\">Trade Outcome<\/div>\n              <div class=\"tpt-outcome-grid\">\n                <div class=\"tpt-history-field\">\n                  <label for=\"result-${trade.id}\">Result<\/label>\n                  <select id=\"result-${trade.id}\" class=\"tpt-result-select\" data-id=\"${trade.id}\">\n                    <option value=\"open\" ${trade.result === 'open' ? 'selected' : ''}>Open<\/option>\n                    <option value=\"win\" ${trade.result === 'win' ? 'selected' : ''}>Win<\/option>\n                    <option value=\"loss\" ${trade.result === 'loss' ? 'selected' : ''}>Loss<\/option>\n                    <option value=\"breakeven\" ${trade.result === 'breakeven' ? 'selected' : ''}>Breakeven<\/option>\n                  <\/select>\n                <\/div>\n\n                <div class=\"tpt-history-field\">\n                  <label for=\"pl-${trade.id}\">Profit \/ Loss (USD)<\/label>\n                  <input\n                    id=\"pl-${trade.id}\"\n                    class=\"tpt-pl-input\"\n                    data-id=\"${trade.id}\"\n                    type=\"number\"\n                    step=\"0.01\"\n                    placeholder=\"Enter profit or loss\"\n                    value=\"${trade.profitLoss !== '' ? trade.profitLoss : ''}\"\n                  >\n                <\/div>\n              <\/div>\n            <\/div>\n\n            <div class=\"tpt-history-section\">\n              <div class=\"tpt-history-section-title\">Editable Notes<\/div>\n              <textarea\n                class=\"tpt-history-notes-area\"\n                data-id=\"${trade.id}\"\n                placeholder=\"Add or edit notes here...\"\n              >${trade.notes || ''}<\/textarea>\n\n              <div class=\"tpt-history-actions\">\n                <div class=\"tpt-history-left-actions\">\n                  <button type=\"button\" class=\"tpt-action-btn tpt-save-btn\" data-save-id=\"${trade.id}\">\n                    Save Changes\n                  <\/button>\n                  <button type=\"button\" class=\"tpt-action-btn tpt-close-btn\" data-close-id=\"${trade.id}\">\n                    Close Trade Details\n                  <\/button>\n                <\/div>\n\n                <div class=\"tpt-history-right-actions\">\n                  <button type=\"button\" class=\"tpt-action-btn tpt-delete-btn\" data-delete-id=\"${trade.id}\">\n                    Delete Trade\n                  <\/button>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n      `;\n    }).join('');\n\n    bindCardEvents();\n  }\n\n  function bindCardEvents() {\n    document.querySelectorAll('[data-expand-id]').forEach(button => {\n      button.addEventListener('click', function () {\n        const id = this.dataset.expandId;\n        const card = document.querySelector('.tpt-history-card[data-id=\"' + id + '\"]');\n        const expanded = card.classList.contains('open');\n\n        document.querySelectorAll('.tpt-history-card.open').forEach(openCard => {\n          openCard.classList.remove('open');\n          const openBtn = openCard.querySelector('.tpt-history-expand-btn');\n          if (openBtn) openBtn.textContent = 'Open Trade Details';\n        });\n\n        if (!expanded) {\n          card.classList.add('open');\n          this.textContent = 'Trade Details Open';\n        }\n      });\n    });\n\n    document.querySelectorAll('[data-close-id]').forEach(button => {\n      button.addEventListener('click', function () {\n        const id = this.dataset.closeId;\n        const card = document.querySelector('.tpt-history-card[data-id=\"' + id + '\"]');\n        if (card) {\n          card.classList.remove('open');\n          const btn = card.querySelector('.tpt-history-expand-btn');\n          if (btn) btn.textContent = 'Open Trade Details';\n        }\n      });\n    });\n\n    document.querySelectorAll('[data-save-id]').forEach(button => {\n      button.addEventListener('click', function () {\n        const id = Number(this.dataset.saveId);\n        const notesEl = document.querySelector('.tpt-history-notes-area[data-id=\"' + id + '\"]');\n        const resultEl = document.querySelector('.tpt-result-select[data-id=\"' + id + '\"]');\n        const profitLossEl = document.querySelector('.tpt-pl-input[data-id=\"' + id + '\"]');\n\n        const trades = getTrades();\n        const index = trades.findIndex(trade => Number(trade.id) === id);\n\n        if (index === -1) return;\n\n        trades[index].notes = notesEl ? notesEl.value : trades[index].notes;\n        trades[index].result = resultEl ? resultEl.value : trades[index].result;\n        trades[index].profitLoss = profitLossEl ? profitLossEl.value : trades[index].profitLoss;\n\n        saveTrades(trades);\n        renderTrades();\n        alert('Trade updated successfully.');\n      });\n    });\n\n    document.querySelectorAll('[data-delete-id]').forEach(button => {\n      button.addEventListener('click', function () {\n        const id = Number(this.dataset.deleteId);\n        const confirmed = confirm('Delete this trade?');\n        if (!confirmed) return;\n\n        const trades = getTrades().filter(trade => Number(trade.id) !== id);\n        saveTrades(trades);\n        renderTrades();\n      });\n    });\n  }\n\n  filterType.addEventListener('change', renderTrades);\n  filterDirection.addEventListener('change', renderTrades);\n  filterResult.addEventListener('change', renderTrades);\n\n  clearHistoryBtn.addEventListener('click', function () {\n    const confirmed = confirm('Are you sure you want to clear all trade history?');\n    if (!confirmed) return;\n\n    localStorage.removeItem(STORAGE_KEY);\n    renderTrades();\n  });\n\n  renderTrades();\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Trade Journal Trade History Review, update and complete your saved trades from The Perfect Trade checklist. Total Saved Trades 0 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-66","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=\/wp\/v2\/pages\/66","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=66"}],"version-history":[{"count":2,"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=\/wp\/v2\/pages\/66\/revisions"}],"predecessor-version":[{"id":69,"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=\/wp\/v2\/pages\/66\/revisions\/69"}],"wp:attachment":[{"href":"https:\/\/checklist.tradefxclusive.co.za\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=66"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}