git ssb

1
const { h, computed, Value, when } = require('mutant')
2
const nest = require('depnest')
3
const ref = require('ssb-ref')
4
const ExpanderHook = require('../../../../expander-hook')
5
const timestamp = require('../../../../message/html/timestamp')
6
7
exports.needs = nest({
8
  'profile.html.person': 'first',
9
  'contact.obs.following': 'first',
10
  'keys.sync.id': 'first',
11
  'message.html': {
12
    link: 'first',
13
    metas: 'first',
14
    actions: 'first',
15
    references: 'first',
16
    forks: 'first'
17
  },
18
  'about.html.image': 'first',
19
  'intl.sync.i18n': 'first'
20
})
21
22
exports.gives = nest('message.html.layout')
23
24
exports.create = function (api) {
25
  const i18n = api.intl.sync.i18n
26
  let yourFollows = null
27
28
  // to get sync follows
29
  setImmediate(() => {
30
    const yourId = api.keys.sync.id()
31
    yourFollows = api.contact.obs.following(yourId)
32
  })
33
34
  return nest('message.html.layout', layout)
35
36
  function layout (msg, { layout, priority, miniContent, content, includeReferences, includeForks = true, actions = true, hooks, forkedFrom, outOfContext }) {
37
    if (!(layout === 'mini')) return
38
39
    const classList = ['Message -mini']
40
41
    const needsExpand = Value(false)
42
    const expanded = Value(false)
43
44
    // new message previews shouldn't contract
45
    if (!msg.key) expanded.set(true)
46
47
    if (yourFollows && yourFollows().includes(msg.value.author)) {
48
      classList.push('-following')
49
    }
50
51
    let replyInfo = null
52
53
    if (msg.value.content.root) {
54
      classList.push('-reply')
55
      if (forkedFrom) {
56
        replyInfo = h('span', [i18n('forked from parent thread '), api.message.html.link(forkedFrom)])
57
      } else if (outOfContext) {
58
        replyInfo = h('span', [i18n('in reply to '), api.message.html.link(msg.value.content.root)])
59
      }
60
    } else if (msg.value.content.project) {
61
      replyInfo = h('span', ['on ', api.message.html.link(msg.value.content.project)])
62
    }
63
64
    if (priority === 2) {
65
      classList.push('-new')
66
    }
67
68
    return h('div', {
69
      classList,
70
      hooks
71
    }, [
72
      messageHeader(msg, {
73
        replyInfo, priority, miniContent
74
      }),
75
      h('section.content', {
76
        classList: [when(expanded, '-expanded')],
77
        hooks: [ExpanderHook(needsExpand)]
78
      }, [content]),
79
      computed([msg.key, actions], (key, actions) => {
80
        if (ref.isMsg(key) && actions) {
81
          return h('footer', [
82
            when(needsExpand, h('div.expander', {
83
              classList: when(expanded, null, '-truncated')
84
            }, [
85
              h('a', {
86
                href: '#',
87
                'ev-click': toggleAndTrack(expanded)
88
              }, when(expanded, i18n('See less'), i18n('See more')))
89
            ])),
90
            h('div.actions', [
91
              api.message.html.actions(msg)
92
            ])
93
          ])
94
        }
95
      }),
96
      includeReferences ? api.message.html.references(msg) : null,
97
      includeForks ? api.message.html.forks(msg) : null
98
    ])
99
100
    // scoped
101
102
    function messageHeader (msg, { replyInfo, priority, miniContent }) {
103
      const yourId = api.keys.sync.id()
104
      const additionalMeta = []
105
      if (priority >= 2) {
106
        additionalMeta.push(h('span.flag -new', { title: 'New Message' }))
107
      }
108
      return h('header', [
109
        h('div.main', [
110
          h('a.avatar', { href: `${msg.value.author}` }, [
111
            api.about.html.image(msg.value.author)
112
          ]),
113
          h('div.main', [
114
            h('div.name', [
115
              api.profile.html.person(msg.value.author),
116
              msg.value.author === yourId ? [' ', h('span.you', {}, i18n('(you)'))] : null
117
            ]),
118
            h('div.meta', [
119
              miniContent, ' ',
120
              replyInfo
121
            ])
122
          ])
123
        ]),
124
        h('div.meta', [
125
          h('strong', timestamp(msg)),
126
          additionalMeta,
127
          api.message.html.metas(msg)
128
        ])
129
      ])
130
    }
131
  }
132
}
133
134
function toggleAndTrack (param) {
135
  return {
136
    handleEvent: handleToggle,
137
    param
138
  }
139
}
140
141
function handleToggle (ev) {
142
  this.param.set(!this.param())
143
  if (!this.param()) {
144
    ev.target.scrollIntoViewIfNeeded()
145
146
    // HACK: due to a browser bug, sometimes the body gets affected!?
147
    // Why not just hack it!!!
148
    if (document.body.scrollTop > 0) {
149
      document.body.scrollTop = 0
150
    }
151
  }
152
}
153