Created Topic Sort

[Alteras]

	Summary	Adds a sortable created date column to the topic list
	Preview	https://discourse.theme-creator.io/theme/Alteras/created-topic-sort
	Repository	GitHub - Alteras1/discourse-created-topic-sort: Discourse theme component adds topic sorting by created date
	Install Guide	How to install a theme or theme component
	New to Discourse Themes?	Beginner’s guide to using Discourse Themes

Install this theme component

This adds a sortable created date column to the topic list. Also adds an optional “Created” tab to the navigation bar.

On desktop view, a whole column is added. On mobile, the created date is only added inline with the activity date when the “Created” sort is selected (see screenshots below).

Before using this component, it may be good to evaluate your community’s need for knowing a created date. There’s already a built in way for auto flagging newly created topics within a certain time period (customizable by users in Preferences > Tracking > Topics).

Settings

Enable Sort by Created Date Nav Bar Item

Adds a “Sort by Created Date” nav bar item to the navigation menu. Default: true

Screenshots

Desktop

Mobile

Enable Column on Created Date Filter Only

Prevents the created date column from being displayed outside of the Create Date filter. Requires the “Enable Sort by Created Date Nav Bar Item” to be true. Default: false

Enable Nav Bar Item in Home Page

Add the “Sort by Created Date” nav bar item in the home page. Default: true

Enable Column in Home Page

Add the “Created” column in the home page. Default: true

Categories to Display Nav Bar Item

List of categories to display in the “Sort by Created Date” nav bar item. Leave empty to display in all categories. Default: empty

Categories to Display Created Column

List of categories to display the “Created” column. Leave empty to display in all categories. Default: empty

Screenshots

Sorting

Mobile view

With Category and Tags

Compatibility & Notes

With mobile, the sort functionality is already heavily limited, so created date would only function as an informational. The additional field only appears if the created date is different from the bumped date.

Compatibility with the Topic List Thumbnails is limited. In list style, it will function normally. In blog style, the created date is pulled to the bottom right. In grid style and masonry style, the created date is only visible when the “Created” filter is selected, and will replace the activity date. In minimal style, the created date is hidden.

[Monikas (JustMonika)]

Wow, another perfect plugin that changes the forum! It would be great if it could integrate with the Discourse Nav Item Icon / Emoji plugin.

Discourse Nav Item Icon / Emoji

Summary Add Icon / Emoji before nav item Repository GitHub - VaperinaDEV/discourse-nav-item-icon-emoji: Add Icon / Emoji before nav item Install Guide How to install a theme or theme component New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component Hello With this theme component you can add icon or emoji before nav items. The theme component based on Discour…

[Don]

I think it should work with it.
Just add it like for example:
emoji:created_date:twitter:spiral_calendar:filter

[Alteras]

Can confirm adding the setting as Don has it does work!

@Don

emoji:created_date:twitter:spiral_calendar:filter

[davidkingham]

Very nice! Unfortunately it doesn’t play well with the Topic Thumbnails TC, adds an extra time for some reason:

Note the extra 7h at the bottom of the center.

It appears I can just hide this .topic-list .topic-list-data:last-of-type but I thought I would let you know

EDIT: I found another oddity, when I click Latest, it highlights Created, and when I click Created it highlights latest

[Alteras]

Huh. That’s interesting. Looks like it’s just an odd side effect of how the Topic Thumbnails and Created Topic Sort adding to the templates at the same time. Might just be an issue with masonry and grid mode? I’ll see if I can make a suitable adjustment for it in the CSS instead of just hiding it, once i figure out a clean way to detect the theme component usage.

The highlighting for latest and created sounds really weird. Created should only be highlighted when the url has /latest?order=created in it… hmmm…

[Alteras]

I’ve updated some of the component to make it prettier for (or at least match) the Topic Thumbnails component.

Feat/topic thumbnail compat

In blog style, the created date is pulled to the bottom right. I couldn’t find a clean way to get it to be right next to the bump date, so this will have to do. In grid style and masonry style, the created date is only visible when the “Created” filter is selected, and will replace the activity date. I tried to get both activity date and created date to display at the same time, but it made the card feel cramped. In minimal style, the created date is hidden.

[putty (Derek Putnam)]

Would it be difficult to add a category scope to this? We would love to have it on our announcements section but don’t need it displayed in our general discussion, etc.

[Alteras]

Not at all! I’ve just pushed out an update that adds four new settings to help control where the nav bar item and column gets displayed.

• Enable nav bar item in home page: Add the “Sort by Created Date” nav bar item in the home page.
• Enable column in home page: Add the “Created” column in the home page.
• Categories to display nav bar item: List of categories to display in the “Sort by Created Date” nav bar item. Leave empty to display in all categories.
• Categories to display created column: List of categories to display the “Created” column. Leave empty to display in all categories.

Add settings to limit display of nav bar and col to certain categories

However, do note that the restrictions on displaying the column only works in sites using the new topic-list changes.

[putty (Derek Putnam)]

Thank you so much! This is awesome!

[dsims (Daniel)]

Any way to make this the default home page? I’ve seen some plugins add options to the “Top Menu” site setting so I’m thinking it’s possible.

Then I could effectively replace the standard Latest by hiding that one with CSS.

[Alteras]

The default homepage can be set with a bit of JS:

import { setDefaultHomepage } from "discourse/lib/utilities";
setDefaultHomepage("/latest?order=created");

Adding the option to the Top Menu settings is definitely preferable, but I don’t think there’s a way to do so from a TC, at least from what I last checked. I’ll have to see if something has changed in the interim.

[dsims (Daniel)]

@Alteras

setDefaultHomepage("/latest?order=created");

Thanks! That should work but it appends %3F_discourse_homepage_rewrite to the url which interferes with the sorting.

app/assets/javascripts/discourse/app/lib/homepage-router-overrides.js

[dsims (Daniel)]

I was able to get around that by doing setDefaultHomepage("latest?order=created&");
But now the problem is, even though all the indicators say so, the actual sorting doesn’t apply.

So I tried the same url using Custom Homepage for Groups and that did work Not sure why that component’s redirect would work differently since I’m pretty sure it using the same method.

[dsims (Daniel)]

figured it out, it needed to clear the PreloadStore

So one can edit your default theme or a new component to add this to the JS:

import { apiInitializer } from "discourse/lib/api";
import { setDefaultHomepage } from "discourse/lib/utilities";
import PreloadStore from "discourse/lib/preload-store";

export default apiInitializer((api) => {
  setDefaultHomepage("latest?order=created&");
  PreloadStore.remove("topic_list");
});

and this CSS to remove the Latest tab:

li.nav-item_latest {
    display: none;
}

Wish it could stay on the root homepage url, but that will probably take a plugin.