Jede Eigenschaft einen Klick entfernt

Productivity

Wenn du Notez für etwas mit einem Lebenszyklus nutzt – eine Leseliste, ein Backlog, Kundennotizen –, hast du wahrscheinlich eine Eigenschaft Status angelegt. Vielleicht auch Assignee. Vielleicht eine Relation Project, die auf die eigene Notiz des Projekts zeigt.

Und dann hast du jedes Mal, wenn du nur die blockierten Einträge sehen wolltest oder nur deine, das Popover Filtern geöffnet, die Eigenschaft gesucht, ihre Auswahl geöffnet, den Wert angehakt und zwei Ebenen UI wieder geschlossen. Drei oder vier Klicks für eine Frage, die du zwanzigmal am Tag stellst.

Tags hatten dieses Problem nie. Sie hatten schon immer einen Abschnitt in der Seitenleiste: eine Zeile pro Tag, eine Zahl daneben, ein Klick filtert. Es ist das meistgenutzte Bedienelement der App. Die naheliegende Frage war, warum es das einzige war.

Was neu ist

Seit v0.8.0 lässt sich jede Eigenschaft vom Typ Auswählen, Mehrfachauswahl, Mitglied oder Relation als eigener Abschnitt in der Seitenleiste anzeigen. Das integrierte Board ebenfalls. Jeder Abschnitt listet seine Werte als Zeilen – ein farbiger Chip für eine Option, ein Avatar für eine Person, ein Notizsymbol für eine verknüpfte Notiz, ein Spaltenname für das Board –, jeweils mit der Zahl der Notizen außerhalb des Papierkorbs, die diesen Wert tragen. Ein Klick auf eine Zeile filtert die Liste danach. Ein Klick auf eine zweite Zeile im selben Abschnitt zeigt Notizen mit dem einen oder dem anderen Wert. Ein Klick in einem anderen Abschnitt grenzt weiter ein.

Einen Abschnitt schaltest du unter Mehr → Eigene Eigenschaften ein: Eigenschaft öffnen, In der Seitenleiste anzeigen einschalten, speichern. Zum Ausschalten fährst du mit der Maus über die Überschrift des Abschnitts in der Seitenleiste, klickst auf den kleinen Einstellungs-Button, der dann erscheint, und wählst Aus der Seitenleiste entfernen. Die Eigenschaft selbst bleibt unverändert; nur ihr Platz in der Seitenleiste ändert sich.

Tags ist standardmäßig eingeschaltet, weil es das immer war. Board ist standardmäßig aus, weil die Board-Ansicht die Spalten schon zeigt und eine zweite Kopie für die meisten nur Rauschen wäre. Beides lässt sich im selben Dialog umschalten.

Außerdem hat die Seitenleiste eine kleinere strukturelle Änderung bekommen, die mehr ausmacht als gedacht: Neue Notiz und Startseite bleiben jetzt oben fixiert, Dateien, Papierkorb, Einstellungen und Mehr unten, und nur die Abschnitte dazwischen scrollen. Zeigst du auf einem Laptop-Bildschirm vier Eigenschaften an, verschwinden die wichtigsten Aktionen nicht mehr oben aus dem Bild.

Warum nur diese Typen

Im ersten Entwurf dieses Features stand „jede Eigenschaft“. Im zweiten, eine Stunde später, stand „jede Eigenschaft, deren Werte eine feste Menge von Dingen sind“, und diese Version ist erschienen.

Eine Zeile in der Seitenleiste muss ein einzelner Wert sein, den man anklicken kann. Eine Option ist so ein Wert. Eine Person auch. Eine verknüpfte Notiz auch. Eine Zahl, ein Datum oder eine Textzeile ist es nicht – um danach zu filtern, brauchst du einen Bereich oder eine Abfrage, und dafür sind die Eingabefelder im Filter-Popover da. Eine Texteigenschaft in die Seitenleiste zu setzen hieße, ein Suchfeld in die Seitenleiste zu setzen – und dann ist es kein Abschnitt der Seitenleiste mehr, sondern ein zweites Filter-Popover mit schlechterem Layout.

Relationen brauchten eine weitere Entscheidung. Eine Auswahl-Eigenschaft hat eine feste Liste von Optionen; die „Optionen“ einer Relation sind die Notizen, auf die jemand verlinkt hat – das können Hunderte sein, und die Menge ändert sich bei jedem neuen Link. Alle aufzulisten würde den Abschnitt riesig machen. Deshalb zeigt ein Relation-Abschnitt die zehn am häufigsten verlinkten Zielnotizen außerhalb des Papierkorbs, die meistverlinkte zuerst, und den Rest erreichst du weiterhin über die Suche im Popover. Hast du eine Relation Project, zeigt die Seitenleiste die Projekte mit den meisten Notizen darunter, und das sind fast immer genau die, die du anklicken willst.

Mitglieder waren im Vergleich einfach: Der Abschnitt listet alle Mitglieder des Workspace, genau wie die Personenauswahl im Popover, weil diese Liste klein und begrenzt ist.

Ein Filter, nicht zwei

Der Teil, bei dem ich am vorsichtigsten war, ist unsichtbar, wenn er funktioniert: Seitenleiste und Filter-Popover sind derselbe Filter.

Notez hält die Filter der Liste in der URL. Das war schon vorher so – deshalb kannst du „alles mit dem Tag client-x und dem Status blocked“ als Lesezeichen speichern –, und die Abschnitte der Seitenleiste schreiben einfach an dieselbe Stelle, aus der das Popover liest. Klickst du in der Seitenleiste auf Blocked, ist Blocked im Popover angehakt. Entfernst du den Haken im Popover, ist die Zeile in der Seitenleiste nicht mehr aktiv. Filter zurücksetzen setzt beides zurück. Es gibt keinen zweiten Zustand, der aus dem Takt geraten könnte, keinen „Seitenleisten-Filter“ als eigenes Konzept neben dem „Filter“.

Diese Entscheidung hat auch einen versteckten Bug behoben. Eine von Hand bearbeitete oder veraltete URL konnte zwei Filter-Tokens für dieselbe Eigenschaft enthalten, und der Server verknüpfte sie mit UND – eine Notiz musste also zu beiden Listen passen, was bei einer Einfachauswahl hieß, dass keine passte, während die Seitenleiste fröhlich eine Zeile als aktiv anzeigte. Der Klick-Handler der Seitenleiste entfernt jetzt alle Tokens seiner Eigenschaft und schreibt genau eines zurück. Das Popover hat das schon so gemacht; die beiden mussten sich nur einig werden.

Zwei weitere Randfälle, weil der Server die Liste auf zehn Eigenschaftsfilter begrenzt: Die Seitenleiste lehnt den elften mit demselben Toast ab wie das Popover, und ein Klick berechnet die nächste URL aus den aktuellen Parametern des Routers statt aus denen, mit denen die Komponente gerendert wurde. So können sich zwei schnelle Klicks oder ein Klick in der Seitenleiste, der sich mit einer Änderung im Popover überschneidet, nicht stillschweigend gegenseitig verschlucken.

Was das Review des Plans gestrichen hat

Dieses Feature wurde vor der ersten Zeile Code in einem Dokument geplant, und der Plan ging durch vier Reviews mit unterschiedlichen Aufträgen – Korrektheit, Hausregeln, Vollständigkeit und „was ist hier over-engineered“. Das letzte war das nützlichste, und es lohnt sich zu sagen, was es entfernt hat.

Einklappbare Abschnitte. Der erste Plan sah an jedem Abschnitt einen Chevron vor und speicherte den eingeklappten Zustand pro Workspace, mit dem Argument, mehrere Abschnitte würden den unteren Teil der Seitenleiste aus dem Bild schieben. Ein Reviewer wies darauf hin, dass der Hauptbereich der Seitenleiste schon unabhängig vom unteren Block scrollte – die Begründung war schlicht falsch. Gestrichen. (Der fixierte obere Block, der tatsächlich erschienen ist, kam später, wegen einer anderen und echten Beschwerde.)

Ein eigener Server-Endpunkt. Der Plan sah eine neue Query vor, die fertige Abschnitte für die Seitenleiste liefert – Namen, Optionen, Reihenfolge, Zähler. Ein Reviewer bemerkte, dass alles außer den Zählern schon in der Eigenschaftsliste steckt, die die App für das Filter-Popover und den Eigenschaften-Dialog lädt, und dass eine zweite Kopie von Namen und Optionen einen zweiten Cache bedeutet, der veralten kann. Erschienen ist eine kleine Query nur für die Zähler, mit Options-ID, Personen-ID oder Notiz-ID als Schlüssel, und den Rest leitet die Seitenleiste aus Daten ab, die sie schon hatte.

Ein Link „Seitenleiste anpassen“. Ich habe unter den Abschnitten einen Link gebaut, der beim Hovern erschien und den Eigenschaften-Dialog öffnete. Er kam in den Development-Build, wurde einmal angeschaut und am selben Nachmittag wieder entfernt. Der Dialog ist unter Mehr einen Klick entfernt, und ein Bedienelement, das nur beim Hovern erscheint, am unteren Ende eines scrollenden Bereichs, findet niemand. Das Menü pro Abschnitt, das geblieben ist, erledigt die Aufgabe, die Leute tatsächlich haben – weg mit diesem hier –, und zwar dort, wo sie ohnehin hinschauen.

Metadaten oder Spalte. Das Flag „in der Seitenleiste anzeigen“ liegt in den vorhandenen JSON-Metadaten der Eigenschaft statt in einer neuen Datenbankspalte. Das ist einen Satz wert, weil über solche Entscheidungen gern gestritten wird. Nach dem Flag wird in SQL nie gefiltert – der Client entscheidet anhand der Eigenschaftsliste, die er ohnehin hat, was er rendert –, eine typisierte Spalte brächte also nichts außer einer Migration. Sollte sich das je ändern, zieht das Flag um, und sonst ändert sich nichts.

Außerdem in diesem Release

Neben der Arbeit an der Seitenleiste ist noch einiges dazugekommen.

  • Favoriten. Angepinnte Notizen heißen jetzt überall Favoriten, mit einem Stern im Kopfbereich der Notiz und einem gefüllten bernsteinfarbenen Stern als Kennzeichen. Der Abschnitt in der Seitenleiste blendet sich aus, solange er leer ist, und das Markieren mit dem Stern löst keinen Toast mehr aus – Stern und Abschnitt zeigen das Ergebnis schon. Die Einbuchstaben-Kürzel P und D auf Karten sind weg; beide Aktionen stehen im Kartenmenü.

  • Startseite. Der oberste Link der Seitenleiste heißt Startseite statt Alle Notizen. Die Überschrift der Seite lautet weiterhin Alle Notizen.

  • Vor und zurück auf dem Board. Ist eine Karte im Seitenpanel geöffnet, springen J und K jetzt durch die Spalte dieser Karte. Auf dem Board waren sie bisher komplett ausgeblendet.

  • Ein aufgeräumter unterer Block. Importieren, Eigene Eigenschaften, Integrationen und Tastenkürzel liegen unter einem Schalter Mehr, der nach oben aufklappt, sodass der Auslöser an seinem Platz bleibt; Einstellungen öffnet direkt den Tab Workspace, und der separate Eintrag Workspace ist weg.

  • Blau. Die Primärfarbe ist in der App, auf der Landingpage und in den Icons von Violett zu Blau gewechselt.

Und zwei Korrekturen: Der Kopf des Seitenpanels zeigte den Titel der Notiz selbst, verkleidet als Breadcrumb, und zeigt jetzt nur noch den Pfad der übergeordneten Notizen; und der Rand der eingeklappten Seitenleiste, an dem du sie wieder aufziehst, reagierte nicht mehr auf Klicks.

Wozu das Ganze

Bei Eigenschaften ging es nie um die Eigenschaften. Es ging darum, „Was ist blockiert?“ oder „Was gehört mir?“ zu fragen und eine Antwort zu bekommen, ohne über das Tool nachzudenken. Bei Tags war das immer ein Klick. Jetzt ist es auch beim Rest ein Klick – und weil Seitenleiste und Popover darunter dasselbe sind, bleibt nur noch die Entscheidung, wo du klickst.

Schalte unter Mehr → Eigene Eigenschaften eine Eigenschaft ein und schau, ob du danach noch das Popover öffnest. Ich öffne es nicht mehr.

Hilfe: Eigene Eigenschaften · Notizen organisieren · Boards verwenden · Changelog v0.8.0

Weiterlesen