Repository: louislam/uptime-kuma
File: src/components/settings/ReverseProxy.vue (Vue)

Code before:
<template>
    <div>
        <h4 class="mt-4">Cloudflare Tunnel</h4>

        <div class="my-3">
            <div>
                cloudflared:
                <span v-if="installed === true" class="text-primary">{{ $t("Installed") }}</span>
                <span v-else-if="installed === false" class="text-danger">{{ $t("Not installed") }}</span>
            </div>

            <div>
                {{ $t("Status") }}:
                <span v-if="running" class="text-primary">{{ $t("Running") }}</span>
                <span v-else-if="!running" class="text-danger">{{ $t("Not running") }}</span>
            </div>

            <div v-if="false">
                {{ message }}
            </div>

            <div v-if="errorMessage" class="mt-3">
                {{ $t("Error Message:") }}
                <textarea v-model="errorMessage" class="form-control" readonly></textarea>
            </div>

            <i18n-t v-if="installed === false" tag="p" keypath="wayToGetCloudflaredURL">
                <a
                    href="https://developers.cloudflare.com/cloudflare-one/connections/connect-apps/install-and-setup/installation/"
                    target="_blank"
                >{{ $t("cloudflareWebsite") }}</a>
            </i18n-t>
        </div>

        <!-- If installed show token input -->
        <div v-if="installed" class="mb-2">
            <div class="mb-4">
                <label class="form-label" for="cloudflareTunnelToken">
                    Cloudflare Tunnel {{ $t("Token") }}
                </label>
                <HiddenInput
                    id="cloudflareTunnelToken"
                    v-model="cloudflareTunnelToken"
                    autocomplete="one-time-code"
                    :readonly="running"
                />
                <div class="form-text">
                    <div v-if="cloudflareTunnelToken" class="mb-3">

Review comment (suggestion):
Since cloudflared write all output to `stderr` (standard error), it is actually not an error message. `Message` would be better.

Code after:
<template>
    <div>
        <h4 class="mt-4">Cloudflare Tunnel</h4>

        <div class="my-3">
            <div>
                cloudflared:
                <span v-if="installed === true" class="text-primary">{{ $t("Installed") }}</span>
                <span v-else-if="installed === false" class="text-danger">{{ $t("Not installed") }}</span>
            </div>

            <div>
                {{ $t("Status") }}:
                <span v-if="running" class="text-primary">{{ $t("Running") }}</span>
                <span v-else-if="!running" class="text-danger">{{ $t("Not running") }}</span>
            </div>

            <div v-if="false">
                {{ message }}
            </div>

            <div v-if="errorMessage" class="mt-3">
                {{ $t("Message:") }}
                <textarea v-model="errorMessage" class="form-control" readonly></textarea>
            </div>

            <i18n-t v-if="installed === false" tag="p" keypath="wayToGetCloudflaredURL">
                <a
                    href="https://developers.cloudflare.com/cloudflare-one/connections/connect-apps/install-and-setup/installation/"
                    target="_blank"
                >{{ $t("cloudflareWebsite") }}</a>
            </i18n-t>
        </div>

        <!-- If installed show token input -->
        <div v-if="installed" class="mb-2">
            <div class="mb-4">
                <label class="form-label" for="cloudflareTunnelToken">
                    Cloudflare Tunnel {{ $t("Token") }}
                </label>
                <HiddenInput
                    id="cloudflareTunnelToken"
                    v-model="cloudflareTunnelToken"
                    autocomplete="one-time-code"
                    :readonly="running"
                />
                <div class="form-text">
                    <div v-if="cloudflareTunnelToken" class="mb-3">