/** * Question Service * Handles question display and navigation */ // Process question content to improve formatting and highlighting function processQuestionContent(content) { // First, preserve existing HTML formatting let processedContent = content; // Add highlighting to text in single quotes that isn't already styled processedContent = processedContent.replace( /`([^`]+)`/g, function(match, text) { // Skip if already inside an HTML tag or existing styled element if (match.match(/<.*>/) || match.includes('class="code"') || match.includes('class="highlight"')) { return match; } return `${text}`; } ); // Style inline code with backticks if not already styled processedContent = processedContent.replace( /`([^`]+)`/g, '$1' ); // Style bold text processedContent = processedContent.replace( /\*\*([^*]+)\*\*/g, '$1' ); // Style italic text processedContent = processedContent.replace( /\*([^*]+)\*/g, '$1' ); // Convert literal newline characters to HTML line breaks processedContent = processedContent.replace(/\n/g, '
'); // Ensure paragraphs have proper spacing and line breaks processedContent = processedContent.replace( /<\/p>

/g, '

\n

' ); // Add more spacing between list items processedContent = processedContent.replace( /<\/li>

  • /g, '
    • \n
  • ' ); return processedContent; } // Generate question content HTML function generateQuestionContent(question) { try { // Get original data const originalData = question.originalData || {}; const machineHostname = originalData.machineHostname || 'N/A'; const namespace = originalData.namespace || 'N/A'; const concepts = originalData.concepts || []; const conceptsString = concepts.join(', '); // Format question content with improved styling const formattedQuestionContent = processQuestionContent(question.content); // Create formatted content with minimal layout return `
    Solve this question on instance: ssh ${machineHostname}
    Namespace: ${namespace}
    Concepts: ${conceptsString}
    ${formattedQuestionContent}
    `; } catch (error) { console.error('Error generating question content:', error); return '
    Error displaying question content. Please try refreshing the page.
    '; } } // Transform API response to question objects function transformQuestionsFromApi(data) { if (data.questions && Array.isArray(data.questions)) { // Transform the questions to match our expected format return data.questions.map(q => ({ id: q.id, content: q.question || '', // Map 'question' field to 'content' title: `Question ${q.id}`, // Create a title from the ID originalData: q, // Keep original data for reference if needed flagged: false // Add flagged status property })); } return []; } // Update question dropdown function updateQuestionDropdown(questionsArray, dropdownMenu, currentId, onQuestionSelect) { // Clear existing dropdown items dropdownMenu.innerHTML = ''; // Add items for each question questionsArray.forEach((question) => { const li = document.createElement('li'); const a = document.createElement('a'); a.className = 'dropdown-item'; a.href = '#'; a.dataset.question = question.id; a.textContent = `Question ${question.id}`; // Add flag icon if question is flagged if (question.flagged) { const flagIcon = document.createElement('span'); flagIcon.className = 'flag-icon ms-2'; flagIcon.innerHTML = ''; a.appendChild(flagIcon); } // Add click event a.addEventListener('click', function(e) { e.preventDefault(); const clickedQuestionId = this.dataset.question; if (onQuestionSelect) { onQuestionSelect(clickedQuestionId); } }); li.appendChild(a); dropdownMenu.appendChild(li); }); } export { processQuestionContent, generateQuestionContent, transformQuestionsFromApi, updateQuestionDropdown };