Social

Collaboration and notifications

Presence, live cursors, comments, mentions, the notification centre and the activity feed (PLAN.md §19). Apps send the live data; these classes style every state. Nothing on this page needs JavaScript: the bell, the pins and the avatar stack open popovers, the drawer is a popover, and the tabs and toggles are radios and checkboxes.

Presence .presence

An avatar stack with a “+3” overflow. As a button it opens who's viewing; as a group it is just a picture with a label. Status dots differ in shape as well as colour.

SO JR KB
NO RV
  • Online
  • Away
  • Busy
  • Offline
AT LP MC SO AT LP
  • ATAva TranOnline
  • LPLeo ParkOnline
  • MCMia ChenAway
  • SOSam OrtizBusy
  • JRJo ReyesAway
  • KBKai BrandtOffline

Live cursors and comment pins .collab-layer

The app sets --x/--y on each cursor and pin. Each person keeps one colour (data-color) across their avatar, cursor and pins. Tap a pin to open its thread.

Q4 launch plan

We ship the export rewrite in week 42, after the freeze lifts. Support gets a two-week heads-up and the release notes go out with the build.

Pricing stays as it is until January; the annual discount is still under review with finance.

Owners: Ava (export), Leo (docs), Mia (support).

AT
Ava Tran

Can we move this to week 43? QA wants one more pass.

LP
Leo Park

Fine by docs.

Resolved Leo Park: “Finance signed off the annual discount.”

Comment threads .comment-thread

A <details>: the summary quotes the anchored text, and closing it collapses the thread. Replies, reaction chips (checkboxes, so they toggle with no script), the typing indicator and a reply box. Resolved threads are muted and say so.

“week 42, after the freeze lifts” 3 comments
AT
Ava Tran

Can we move this to week 43? QA wants one more pass on the CSV path. @Leo Park does that work for docs?

LP
Leo Park

Fine by docs. @you can you tell support?

MC
Mia Chen

Support is ready either way.

Leo is typing…
“release notes go out with the build” 2 comments
SO
Sam Ortiz

Collapsed thread: open it to read.

AT
Ava Tran

Noted.

“annual discount” Resolved 4 comments
LP
Leo Park

Finance signed off the annual discount.

“Owners: Ava, Leo, Mia” Resolved 1 comment
MC
Mia Chen

Resolved but open: still readable, muted.

Mentions .mention

Inline chips that wrap with the sentence; .is-self marks you. The suggestion list is the forms group's .combobox and .listbox: an option holding an avatar lays out as a person row. The app filters as you type after “@”.

Thanks @Ava Tran and @Leo Park. @you, the hand-off is yours. A plain span works too: @design-team.

  • ATAva Tran@ava
  • ABAlex Brandt@alexb
  • AOAmir Osei@amir
  • ANAnna (no access)@anna

Typing indicator .typing

Core's indicator, unchanged: dots pulse only with motion allowed.

Leo is typing…
Ava and 2 others are typing…

Notification centre .notifications

One block of markup in three places: a page panel, a popover from the bell, and a drawer. Unread rows are tinted, dotted and bold; a group collapses “3 new comments on …”; do not disturb is a switch.

Notifications

4 new

Paused until 09:00. You'll still see everything here.

  • LP

    Leo Park mentioned you in Q4 launch plan

    “@you can you tell support?”

  • 3 new comments on Q4 launch plan

    • Ava Tran: “Can we move this to week 43?”

    • Leo Park: “Fine by docs.”

    • Mia Chen: “Support is ready either way.”

  • SO

    Sam Ortiz assigned you EXP-412 CSV export

  • JR

    Jo Reyes resolved your comment on Pricing

  • Export finished: 1,240 rows

You're all caught up

Nothing new from the pages you follow.

Activity feed .activity

The instruments group's ol.timeline with the actor's avatar in place of the dot: who, what, which object, when. A system event keeps the dot and its state.

Today
  1. MC

    Mia Chen commented on Q4 launch plan

    Support is ready either way.
  2. LP

    Leo Park resolved a comment on Pricing

  3. Export EXP-412 finished: 1,240 rows

  4. AT

    Ava Tran invited @Kai Brandt to Q4 launch plan

Yesterday
  1. SO

    Sam Ortiz changed the status of EXP-412 from Open to In progress

  2. Sync with billing failed twice, then recovered

Notifications