Convert Problem Block Mako Templates to Django Templates (#37570)

* fix: convert mako to django templates for problem block

* fix: pylint issues

xmodule/capa/templates/codeinput.html

@@ -1,50 +1,46 @@
-<%page expression_filter="h"/>
-<%!
-from django.utils.translation import gettext as _
-from openedx.core.djangolib.markup import HTML
-%>
-<div id="textbox_${id}" class="capa_inputtype textbox cminput">
-  % if response_data['label']:
-    <label class="problem-group-label" for="cm-textarea-${id}">${response_data['label']}</label>
-  % else:
-    <label class="sr problem-group-label" for="cm-textarea-${id}">${_('Code Editor')}</label>
-  % endif
-  <textarea rows="${rows}" cols="${cols}" name="input_${id}"
-            aria-label="${aria_label}"
-            aria-describedby="answer_${id}"
-            id="input_${id}"
+{% load i18n %}
+<div id="textbox_{{ id }}" class="capa_inputtype textbox cminput">
+  {% if response_data.label %}
+    <label class="problem-group-label" for="cm-textarea-{{ id }}">{{ response_data.label }}</label>
+  {% else %}
+    <label class="sr problem-group-label" for="cm-textarea-{{ id }}">{% trans "Code Editor" as editor_label %}{{ editor_label|force_escape }}</label>
+  {% endif %}
+  <textarea rows="{{ rows }}" cols="{{ cols }}" name="input_{{ id }}"
+            aria-label="{{ aria_label }}"
+            aria-describedby="answer_{{ id }}"
+            id="input_{{ id }}"
             tabindex="0"
-            data-mode="${mode}"
-            data-tabsize="${tabsize}"
-            % if linenumbers:
+            data-mode="{{ mode }}"
+            data-tabsize="{{ tabsize }}"
+            {% if linenumbers %}
             data-linenums="true"
-            % endif
-            % if hidden:
+            {% endif %}
+            {% if hidden %}
       	    style="display:none;"
-            % endif
-  >${value}</textarea>
-  <span class="cm-editor-exit-message capa-message" id="cm-editor-exit-message-${id}">
-    ${code_mirror_exit_message}
+            {% endif %}
+  >{{ value }}</textarea>
+  <span class="cm-editor-exit-message capa-message" id="cm-editor-exit-message-{{ id }}">
+    {{ code_mirror_exit_message }}
   </span>
 
   <div class="grader-status" tabindex="-1">
 
-    <%include file="status_span.html" args="status=status, status_id=id"/>
+    {% include "status_span.html" with status=status status_id=id %}
 
-    % if status == 'queued':
-      <span style="display:none;" class="xqueue" id="${id}">${queue_len}</span>
-    % endif
+    {% if status == 'queued' %}
+      <span style="display:none;" class="xqueue" id="{{ id }}">{{ queue_len }}</span>
+    {% endif %}
 
-    % if hidden:
-      <div style="display:none;" name="${hidden}" inputid="input_${id}" />
-    % endif
+    {% if hidden %}
+      <div style="display:none;" name="{{ hidden }}" inputid="input_{{ id }}" />
+    {% endif %}
 
-    <p class="debug">${status.display_name}</p>
+    <p class="debug">{{ status.display_name }}</p>
   </div>
 
-  <span id="answer_${id}"></span>
+  <span id="answer_{{ id }}"></span>
 
   <div class="external-grader-message">
-    ${HTML(msg)}
+    {{ msg|safe }}
   </div>
 </div>