From 629847488ba4c8d8fe1aa4883271bed506eaab15 Mon Sep 17 00:00:00 2001
From: Fire Demon <firedemon@creature.cafe>
Date: Sat, 18 Jul 2020 15:03:20 -0500
Subject: [Feature, UI] Visualize thread nesting in Web app

---
 .../flavours/glitch/features/status/components/detailed_status.js | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

(limited to 'app/javascript/flavours/glitch/features/status')

diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index e4aecbf94..24e614a8d 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -251,9 +251,15 @@ export default class DetailedStatus extends ImmutablePureComponent {
       );
     }
 
+    const selectorAttribs = {
+      'data-status-by': `@${status.getIn(['account', 'acct'])}`,
+      'data-nest-level': status.get('nest_level'),
+      'data-nest-deep': status.get('nest_level') >= 15,
+    };
+
     return (
       <div style={outerStyle}>
-        <div ref={this.setRef} className={classNames('detailed-status', `detailed-status-${status.get('visibility')}`, { compact })} data-status-by={status.getIn(['account', 'acct'])}>
+        <div ref={this.setRef} className={classNames('detailed-status', `detailed-status-${status.get('visibility')}`, { compact })} {...selectorAttribs}>
           <a href={status.getIn(['account', 'url'])} onClick={this.handleAccountClick} className='detailed-status__display-name'>
             <div className='detailed-status__display-avatar'><Avatar account={status.get('account')} size={48} /></div>
             <DisplayName account={status.get('account')} localDomain={this.props.domain} />
-- 
cgit