code: def create_gradio_client_app_en():  # noqa:C901
      css = """
            .gradio-container {
                font-family: 'IBM Plex Sans', sans-serif;
            }
            .gr-button {
                color: white;
                border-color: black;
                background: black;
            }
            input[type='range'] {
                accent-color: black;
            }
            .dark input[type='range'] {
                accent-color: #dfdfdf;
            }
            #gallery {
                min-height: 22rem;
                margin-bottom: 15px;
                margin-left: auto;
                margin-right: auto;
                border-bottom-right-radius: .5rem !important;
                border-bottom-left-radius: .5rem !important;
            }
            #gallery>div>.h-full {
                min-height: 20rem;
            }
            .details:hover {
                text-decoration: underline;
            }
            .gr-button {
                white-space: nowrap;
            }
            .gr-button:focus {
                border-color: rgb(147 197 253 / var(--tw-border-opacity));
                outline: none;
                box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
                --tw-border-opacity: 1;
                --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) \
                  var(--tw-ring-offset-color);
                --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px var(--tw-ring-offset-width)) var(--tw-ring-color);
                --tw-ring-color: rgb(191 219 254 / var(--tw-ring-opacity));
                --tw-ring-opacity: .5;
            }
            .footer {
                margin-bottom: 45px;
                margin-top: 35px;
                text-align: center;
                border-bottom: 1px solid #e5e5e5;
            }
            .footer>p {
                font-size: .8rem;
                display: inline-block;
                padding: 0 10px;
                transform: translateY(10px);
                background: white;
            }
            .dark .footer {
                border-color: #303030;
            }
            .dark .footer>p {
                background: #0b0f19;
            }
            .prompt h4{
                margin: 1.25em 0 .25em 0;
                font-weight: bold;
                font-size: 115%;
            }
    """
  
      block = gr.Blocks(css=css)
  
      with block:
          gr.HTML(
              """
                <div style="text-align: center; max-width: 650px; margin: 0 auto;">
                  <div
                    style="
                      display: inline-flex;
                      gap: 0.8rem;
                      font-size: 1.75rem;
                      justify-content: center;
                    "
                  >
                  <h1>
                  FastDeploy Client
                  </h1>
                  </div>
                  <p font-size: 94%">
                  The client is used for creating requests to fastdeploy server.
                  </p>
                </div>
            """
          )
          with gr.Group():
              with gr.Box():
                  with gr.Column():
                      with gr.Row():
                          server_addr_text = gr.Textbox(
                              label="server ip",
                              show_label=True,
                              max_lines=1,
                              placeholder="localhost",
                          )
  
                          server_http_port_text = gr.Textbox(
                              label="server port",
                              show_label=True,
                              max_lines=1,
                              placeholder="8000",
                          )
  
                          server_metric_port_text = gr.Textbox(
                              label="metrics port",
                              show_label=True,
                              max_lines=1,
                              placeholder="8002",
                          )
                      with gr.Row():
                          model_name_text = gr.Textbox(
                              label="model name",
                              show_label=True,
                              max_lines=1,
                              placeholder="yolov5",
                          )
                          model_version_text = gr.Textbox(
                              label="model version",
                              show_label=True,
                              max_lines=1,
                              placeholder="1",
                          )
  
              with gr.Box():
                  with gr.Tab("Component form"):
                      check_button = gr.Button(
                          "get model input and output"
                      )
                      component_format_column = gr.Column(visible=False)
                      with component_format_column:
                          task_radio = gr.Radio(
                              choices=list(supported_tasks.keys()),
                              value="unspecified",
                              label="task type",
                              visible=True,
                          )
                          gr.Markdown(
                              "Choose text or image component to input according to data type"
                          )
                          with gr.Row():
                              with gr.Column():
                                  gr.Markdown("Inputs")
                                  input_accordions = []
                                  input_name_texts = []
                                  input_images = []
                                  input_texts = []
                                  for i in range(6):
                                      accordion = gr.Accordion(
                                          "variable {}".format(i),
                                          open=True,
                                          visible=False,
                                      )
                                      with accordion:
                                          input_name_text = gr.Textbox(
                                              label="variable name",
                                              interactive=False,
                                          )
                                          input_image = gr.Image(
                                              type="numpy"
                                          )
                                          input_text = gr.Textbox(
                                              label="text",
                                              max_lines=1000,
                                          )
                                      input_accordions.append(accordion)
                                      input_name_texts.append(
                                          input_name_text
                                      )
                                      input_images.append(input_image)
                                      input_texts.append(input_text)
  
                              with gr.Column():
                                  gr.Markdown("Outputs")
                                  output_accordions = []
                                  output_name_texts = []
                                  output_images = []
                                  output_texts = []
                                  for i in range(6):
                                      accordion = gr.Accordion(
                                          "variable {}".format(i),
                                          open=True,
                                          visible=False,
                                      )
                                      with accordion:
                                          output_name_text = gr.Textbox(
                                              label="variable name",
                                              interactive=False,
                                          )
                                          output_text = gr.Textbox(
                                              label="text",
                                              interactive=False,
                                              show_label=True,
                                          )
                                          output_image = gr.Image(
                                              interactive=False
                                          )
                                      output_accordions.append(
                                          accordion
                                      )
                                      output_name_texts.append(
                                          output_name_text
                                      )
                                      output_images.append(output_image)
                                      output_texts.append(output_text)
                          component_submit_button = gr.Button(
                              "submit request"
                          )
                  with gr.Tab("Original form"):
                      gr.Markdown("Request")
                      raw_payload_text = gr.Textbox(
                          label="request payload", max_lines=10000
                      )
                      with gr.Column():
                          gr.Markdown("Response")
                          output_raw_text = gr.Textbox(
                              label="raw response data",
                              interactive=False,
                          )
                      raw_submit_button = gr.Button("submit request")
  
              with gr.Box():
                  with gr.Column():
                      gr.Markdown(
                          "Metrics（update automatically when submit request，or click update metrics button manually）"
                      )
                      output_html_table = gr.HTML(
                          label="metrics",
                          interactive=False,
                          show_label=False,
                          value=metrics_table_head_en.format("", ""),
                      )
                      update_metric_button = gr.Button("update metrics")
  
              status_text = gr.Textbox(
                  label="status",
                  show_label=True,
                  max_lines=1,
                  interactive=False,
              )
  
          lang_text = gr.Textbox(
              label="lang",
              show_label=False,
              value="en",
              max_lines=1,
              visible=False,
          )  # This text box is only used for divide zh and en page
  
          all_input_output_components = (
              input_accordions
              + input_name_texts
              + input_images
              + input_texts
              + output_accordions
              + output_name_texts
              + output_images
              + output_texts
          )
  
          def get_input_output_name(
              server_ip,
              server_port,
              model_name,
              model_version,
              lang_text,
          ):
              try:
                  server_addr = server_ip + ":" + server_port
                  (
                      input_metas,
                      output_metas,
                  ) = _http_manager.get_model_meta(
                      server_addr, model_name, model_version
                  )
              except Exception as e:
                  return {status_text: str(e)}
              results = {
                  component: None
                  for component in all_input_output_components
              }
              results[component_format_column] = gr.update(visible=True)
              for input_accordio in input_accordions:
                  results[input_accordio] = gr.update(visible=False)
              for output_accordio in output_accordions:
                  results[output_accordio] = gr.update(visible=False)
              results[
                  status_text
              ] = "Get model inputs and outputs successfully."
              for i, input_meta in enumerate(input_metas):
                  results[input_accordions[i]] = gr.update(visible=True)
                  results[input_name_texts[i]] = input_meta["name"]
              for i, output_meta in enumerate(output_metas):
                  results[output_accordions[i]] = gr.update(
                      visible=True
                  )
                  results[output_name_texts[i]] = output_meta["name"]
              return results
  
          def component_inference(*args):
              server_ip = args[0]
              http_port = args[1]
              metric_port = args[2]
              model_name = args[3]
              model_version = args[4]
              names = args[5 : 5 + len(input_name_texts)]
              images = args[
                  5
                  + len(input_name_texts) : 5
                  + len(input_name_texts)
                  + len(input_images)
              ]
              texts = args[
                  5
                  + len(input_name_texts)
                  + len(input_images) : 5
                  + len(input_name_texts)
                  + len(input_images)
                  + len(input_texts)
              ]
              task_type = args[-1]
              server_addr = server_ip + ":" + http_port
              if (
                  server_ip
                  and http_port
                  and model_name
                  and model_version
              ):
                  inputs = {}
                  for i, input_name in enumerate(names):
                      if input_name:
                          if images[i] is not None:
                              inputs[input_name] = np.array([images[i]])
                          if texts[i]:
                              inputs[input_name] = np.array(
                                  [[texts[i].encode("utf-8")]],
                                  dtype=np.object_,
                              )
                  try:
                      infer_results = _http_manager.infer(
                          server_addr, model_name, model_version, inputs
                      )
                      results = {status_text: "Inference successfully."}
                      for i, (output_name, data) in enumerate(
                          infer_results.items()
                      ):
                          results[output_name_texts[i]] = output_name
                          results[output_texts[i]] = str(data)
                          if task_type != "unspecified":
                              try:
                                  results[
                                      output_images[i]
                                  ] = supported_tasks[task_type](
                                      images[0], data
                                  )
                              except Exception:
                                  results[output_images[i]] = None
                      if metric_port:
                          html_table = get_metric_data(
                              server_ip, metric_port, "en"
                          )
                          results[output_html_table] = html_table
                      return results
                  except Exception as e:
                      return {status_text: "Error: {}".format(e)}
              else:
                  return {
                      status_text: "Please input server addr, model name and model version."
                  }
  
          def raw_inference(*args):
              server_ip = args[0]
              http_port = args[1]
              metric_port = args[2]
              model_name = args[3]
              model_version = args[4]
              payload_text = args[5]
              server_addr = server_ip + ":" + http_port
              try:
                  result = _http_manager.raw_infer(
                      server_addr,
                      model_name,
                      model_version,
                      payload_text,
                  )
                  results = {
                      status_text: "Get response from server",
                      output_raw_text: result,
                  }
                  if server_ip and metric_port:
                      html_table = get_metric_data(
                          server_ip, metric_port, "en"
                      )
                      results[output_html_table] = html_table
                  return results
              except Exception as e:
                  return {status_text: "Error: {}".format(e)}
  
          def update_metric(server_ip, metrics_port, lang_text):
              if server_ip and metrics_port:
                  try:
                      html_table = get_metric_data(
                          server_ip, metrics_port, "en"
                      )
                      return {
                          output_html_table: html_table,
                          status_text: "Update metrics successfully.",
                      }
                  except Exception as e:
                      return {status_text: "Error: {}".format(e)}
              else:
                  return {
                      status_text: "Please input server ip and metrics_port."
                  }
  
          check_button.click(
              fn=get_input_output_name,
              inputs=[
                  server_addr_text,
                  server_http_port_text,
                  model_name_text,
                  model_version_text,
                  lang_text,
              ],
              outputs=[
                  *all_input_output_components,
                  check_button,
                  component_format_column,
                  status_text,
              ],
          )
          component_submit_button.click(
              fn=component_inference,
              inputs=[
                  server_addr_text,
                  server_http_port_text,
                  server_metric_port_text,
                  model_name_text,
                  model_version_text,
                  *input_name_texts,
                  *input_images,
                  *input_texts,
                  task_radio,
              ],
              outputs=[
                  *output_name_texts,
                  *output_images,
                  *output_texts,
                  status_text,
                  output_html_table,
              ],
          )
          raw_submit_button.click(
              fn=raw_inference,
              inputs=[
                  server_addr_text,
                  server_http_port_text,
                  server_metric_port_text,
                  model_name_text,
                  model_version_text,
                  raw_payload_text,
              ],
              outputs=[output_raw_text, status_text, output_html_table],
          )
          update_metric_button.click(
              fn=update_metric,
              inputs=[
                  server_addr_text,
                  server_metric_port_text,
                  lang_text,
              ],
              outputs=[output_html_table, status_text],
          )
      return block
  
file_path: VisualDL/visualdl/component/inference/fastdeploy_client/client_app.py
imports: import gradio
  import numpy
  from .http_client_manager import get_metric_data
  from .http_client_manager import HttpClientManager
  from .http_client_manager import metrics_table_head
  from .http_client_manager import metrics_table_head_en
  from .visualizer import visualize_detection
  from .visualizer import visualize_face_alignment
  from .visualizer import visualize_face_detection
  from .visualizer import visualize_headpose
  from .visualizer import visualize_keypoint_detection
  from .visualizer import visualize_matting
  from .visualizer import visualize_ocr
  from .visualizer import visualize_segmentation
label_desc: Use image node_id 2 for calling a global function with example usage: create_gradio_client_app_en() and returns: block, results, dict, results, dict, dict, results, dict, dict, dict, dict