zulip/web/templates/recent_view_row.hbs

<tr id="recent_conversation:{{conversation_key}}" class="{{#if unread_count}}unread_topic{{/if}} {{#if is_private}}private_conversation_row{{/if}}">
    <td class="recent_topic_stream">
        <div class="flex_container flex_container_pm">
            <div class="left_part recent_view_focusable" data-col-index="{{ column_indexes.stream }}">
                {{#if is_private}}
                <span class="zulip-icon zulip-icon-user"></span>
                <a href="{{pm_url}}" class="recent-view-table-link">{{t "Direct messages" }}</a>
                {{else}}
                <span class="stream-privacy-original-color-{{stream_id}} stream-privacy filter-icon" style="color: {{stream_color}}">
                    {{> stream_privacy }}
                </span>
                <a href="{{topic_url}}" class="recent-view-table-link">{{stream_name}}</a>
                {{/if}}
            </div>
            {{!-- For presence/group indicator --}}
            {{#if is_private}}
            <div class="right_part">
                <span class="pm_status_icon {{#unless is_group}}show-tooltip{{/unless}}" data-tippy-placement="top" data-user-ids-string="{{user_ids_string}}">
                    {{#if is_group}}
                    <span class="zulip-icon zulip-icon-triple-users"></span>
                    {{else if is_bot}}
                    <span class="zulip-icon zulip-icon-bot" aria-hidden="true"></span>
                    {{else}}
                    <span class="{{user_circle_class}} user_circle" data-presence-indicator-user-id="{{user_ids_string}}"></span>
                    {{/if}}
                </span>
            </div>
            {{/if}}
        </div>
    </td>
    <td class="recent_topic_name"{{#if (not is_spectator) }} colspan="2"{{/if}}>
        <div class="flex_container">
            <div class="left_part recent_view_focusable line_clamp" data-col-index="{{ column_indexes.topic }}">
                {{#if is_private}}
                <a href="{{pm_url}}" class="recent-view-table-link">{{{rendered_pm_with}}}</a>
                {{else}}
                <a class="white-space-preserve-wrap recent-view-table-link" href="{{topic_url}}">{{topic}}</a>
                {{/if}}
            </div>
            <div class="right_part">
                {{#if is_private}}
                <div class="recent_topic_actions">
                    <div class="recent_view_focusable" data-col-index="{{ column_indexes.read }}">
                        <span class="unread_count unread_count_pm recent-view-table-unread-count {{#unless unread_count}}unread_hidden{{/unless}} tippy-zulip-tooltip on_hover_topic_read" data-user-ids-string="{{user_ids_string}}" data-tippy-content="{{t 'Mark as read' }}" role="button" tabindex="0" aria-label="{{t 'Mark as read' }}">{{unread_count}}</span>
                    </div>
                </div>
                <div class="recent_topic_actions dummy_action_button">
                    <div class="recent_view_focusable" data-col-index="{{ column_indexes.read }}">
                        {{!-- Invisible icon, used only for alignment of unread count. --}}
                        <i class="zulip-icon zulip-icon-mute on_hover_topic_unmute recipient_bar_icon"></i>
                    </div>
                </div>
                {{else}}
                <span class="unread_mention_info tippy-zulip-tooltip {{#unless mention_in_unread}}unread_hidden{{/unless}}"
                  data-tippy-content="{{t 'You have mentions'}}">@</span>
                <div class="recent_topic_actions">
                    <div class="recent_view_focusable hidden-for-spectators" data-col-index="{{ column_indexes.read }}">
                        <span class="unread_count recent-view-table-unread-count {{#unless unread_count}}unread_hidden{{/unless}} tippy-zulip-tooltip on_hover_topic_read" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-tippy-content="{{t 'Mark as read' }}" role="button" tabindex="0" aria-label="{{t 'Mark as read' }}">{{unread_count}}</span>
                    </div>
                </div>
                <div class="recent_topic_actions">
                    <div class="hidden-for-spectators">
                        <span class="recent_view_focusable change_visibility_policy hidden-for-spectators" data-stream-id="{{stream_id}}" data-topic-name="{{topic}}" data-col-index="{{ column_indexes.mute }}">
                            {{#if (eq visibility_policy all_visibility_policies.FOLLOWED)}}
                                <i class="zulip-icon zulip-icon-follow recipient_bar_icon" data-tippy-content="{{t 'You follow this topic.'}}"
                                  role="button" tabindex="0" aria-haspopup="true" aria-label="{{t 'You follow this topic.' }}"></i>
                            {{else if (eq visibility_policy all_visibility_policies.UNMUTED)}}
                                <i class="zulip-icon zulip-icon-unmute-new recipient_bar_icon" data-tippy-content="{{t 'You have unmuted this topic.'}}"
                                  role="button" tabindex="0" aria-haspopup="true" aria-label="{{t 'You have unmuted this topic.' }}"></i>
                            {{else if (eq visibility_policy all_visibility_policies.MUTED)}}
                                <i class="zulip-icon zulip-icon-mute-new recipient_bar_icon" data-tippy-content="{{t 'You have muted this topic.'}}"
                                  role="button" tabindex="0" aria-haspopup="true" aria-label="{{t 'You have muted this topic.' }}"></i>
                            {{else}}
                                <i class="zulip-icon zulip-icon-inherit recipient_bar_icon"
                                  role="button" tabindex="0" aria-haspopup="true" aria-label="{{t 'Notifications are based on your configuration for this channel.' }}"></i>
                            {{/if}}
                        </span>
                    </div>
                </div>
                {{/if}}
            </div>
        </div>
    </td>
    <td class='recent_topic_users'>
        <ul class="recent_view_participants">
            {{#if other_senders_count}}
            <li class="recent_view_participant_item tippy-zulip-tooltip" data-tooltip-template-id="recent_view_participant_overflow_tooltip:{{conversation_key}}">
                <span class="recent_view_participant_overflow">+{{other_senders_count}}</span>
            </li>
            <template id="recent_view_participant_overflow_tooltip:{{conversation_key}}">{{{other_sender_names_html}}}</template>
            {{/if}}
            {{#each senders}}
                {{#if this.is_muted}}
                <li class="recent_view_participant_item participant_profile tippy-zulip-tooltip" data-tippy-content="{{t 'Muted user'}}" data-user-id="{{this.user_id}}">
                    <span><i class="fa fa-user recent_view_participant_overflow"></i></span>
                </li>
                {{else}}
                <li class="recent_view_participant_item participant_profile tippy-zulip-tooltip" data-tippy-content="{{this.full_name}}" data-user-id="{{this.user_id}}">
                    <img src="{{this.avatar_url_small}}" class="recent_view_participant_avatar" />
                </li>
                {{/if}}
            {{/each}}
        </ul>
    </td>
    <td class="recent_topic_timestamp">
        <div class="last_msg_time tippy-zulip-tooltip" data-tippy-content="{{this.full_last_msg_date_time}}">
            <a href="{{last_msg_url}}" tabindex="-1">{{ last_msg_time }}</a>
        </div>
    </td>
</tr>