(+ New topic) button on all pages

[pfaffman (Jay Pfaffman)]

@Eduardo_Braga

I also want to show it to the unregistered user, clicking the button will ask you to login

Remove this line from the theme component:

https://github.com/discourse/discourse-new-topic-button-theme-component/blob/master/common/header.html#L5

[pfaffman (Jay Pfaffman)]

Oh. Bummer. I don’t know what “wrong position” means (it seems OK on my test site), but did assume that the button would work, which I see now that it doesn’t. It looks like it’s not as simple as I thought.

[Dax (Daniela)]

@Eduardo_Braga

I don’t want to display it on mobile, how do I do it?

Create a new theme component and add this in the Mobile > CSS tab

.mobile-view #new-create-topic {
    display:none
}

[eextra (Sylwia)]

good idea - you did it ?

[jord8on (Jordan)]

Can someone help me know what CSS to target to get this + New Topic button to look/function exactly as the colorful “Reply” button on my site? (i.e. the standard state, as well as the hover and clicked-on state - active?)

Here’s a visual explanation of what I’d like to do…

[rogerco]

change its class to btn-primary ?
(not sure if you can have two btn-primary items on a page)
If you want to have a pure css solution then inspect the styling of the blue primary button (in all its states) and replicate that.

[Ant_Vincent]

How do I move this button please to this location?

[iidbae]

Anyone got this error in browser Developer Console? Inspect element.

Deprecation notice: Import the User class instead of using User (deprecated since Discourse 2.4.0) (removal in Discourse 2.6.0)

The error increase loading page for first time visitor.

I have deactivated this component from Discourse default theme and the error message is gone. I am in latest version, 2.6.0.beta3.

Probably, this component should be updated.

I found this clue from Import the User class instead of using User - dev - Discourse Meta.

I like this component.

[polusok (Mykhailo Poliarush)]

i’ve updated to 2.5.4 and theme stop working, no “create” button available,

got error in console

Uncaught Error: Could not find module `@popperjs/core` imported from `discourse/plugins/retort/discourse/initializers/retort-init`
    at _ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74592
    at f (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74561)
    at t.module.exports.s.<computed> (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74639)
    at t.module.exports.s.<computed> (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74470)
    at require (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74637)
    at t._prepareInitializer (_application-7dccd0aa5cedea9c0cf70446bcf44eb9d9c10125f140a457649d0b8ceac3a56c.js:7007)
    at _application-7dccd0aa5cedea9c0cf70446bcf44eb9d9c10125f140a457649d0b8ceac3a56c.js:7028
    at Array.forEach (<anonymous>)
    at t.start (_application-7dccd0aa5cedea9c0cf70446bcf44eb9d9c10125f140a457649d0b8ceac3a56c.js:7024)
    at _start-discourse-efa4e5abfbd1b50b5152ffbe64d5dcea9f7c33f766dcc6387e2711f0f2112148.js:3

[knandi (Andreas Knapp)]

I’m asking the same. Any solutions? Thank you!

[irek]

@Johani

I only put it all together and added the theme settings to make things simple.

Thanks for this component @Joe.
It works perfectly with a small exception
On mobile I still have two buttons: new one +  and default one+ New Topic buttons.

I made the default one disappear by changing the following style definition:

Now it works fine on desktops and on mobiles, but it would be nice if your component would take care about this. Especially that if from some reason some admin will turn off your component, any + New Topic button won’t be visible.

[irek]

@Johani I made a pull request with change mentioned above.
https://github.com/discourse/discourse-new-topic-button-theme-component/pull/2/files
Could you please look at it?

[neo (R.Zhang)]

Bug?
I found this component had a conflict with the component "Personal Message Bubbles

".

Personal Message Bubbles

I’ve created a theme component to change the style of the personal message posts to bubbles to help distinguish them from topics. Settings: Set the background color of the bubble to your theme’s primary, secondary or tertiary colors, or a selection of other common colors. Select different colors to help distinguish the messages you send from the messages sent to you. Set the background opacity of the bubble - the larger the percent the deeper the color. Choose whether to display the message b…

It seems it disabled the Message Bubble on Desktop (computer) automatically and reset the message style as default, but it’s fine with the mobile.

can it be fixed?

[neo (R.Zhang)]

and it also disabled the “topic-width-desktop” component.

How to increase width of topic

I’ve made a very simple Theme Component which widens the Topic on Desktop only. It was made for my personal notebooking/blogging Discourse at bawmedical.co.uk and it’s not very advanced and doesn’t use @media queries (yet). But it may suit simple use-cases. If anyone uses it and has feedback then we can create a new Topic for discussion of it here on Meta, or submit Issues or PRs on GitHub https://github.com/pacharanero/discourse-topic-width-desktop (This is as much an aide-memoire for myself …

[nolo]

Thank you for the component! I think there can be good use cases to always have the option to create a new topic be present in the header. But I’m struggling with one detail of implementing it and wonder how others approach this:

Right now, the component reflects the category the user is on and will open the composer with this category pre-filled. But it doesn’t reflect whether the user has write access to that particular category. So it will pre-fill the composer with that category (although the user couldn’t otherwise select that category manually) and result in an error when trying to save the topic.

The default New-topic-button addresses this by being disabled on such categories. But I think it wouldn’t be so intuitive either to copy this behavior, because the idea with the button in the header is to have a global access to create new topics. And then it would be weird if it’s sometimes not functional.

What could be a good general approach for this? Or how do others that use the component approach it? Just drop the pre-filling alltogether?

[jrgong]

I guess best behaviour would be to start the composer with empty category if the user does not have the permission to create new topic in the current one? Potentially with a modal and a notice about such.

[dodesz (Don)]

Hello Johani,

Thanks for this TC

I made some changes but not sure it is good.

I change
if (!Discourse.User.current()) return;
to
if (api.getCurrentUser() === null) return false; and move to above api.decorateWidget line

And change
draftKey: composerModal.DRAFT
to
draftKey: composerModal.draft_key || composerModal.NEW_TOPIC_KEY

Because it handle separate the default topic create draft and the header topic create button. So if save a draft with the default create button and after that click the header button it will create new topic not the draft vice versa. With this change it seems to solve this…

[JQ331]

Hi There. I can can get the theme’s code working just fine on my live site (thanks!). I would also like to test it out on a local discourse instance for development (updated discourse and ember/cli as of 2 weeks ago).

In that local development environment, it doesn’t work. It adds the new topic button, but when I click that button, no composer comes up, and it shows this error:

Uncaught Error: Assertion Failed: The key provided to set must be a string or number, you passed undefined
    at assert (index.js:172)
    at set (index.js:2802)
    at Class.set (observable.js:176)
    at composer.js:769
    at Array.forEach (<anonymous>)
    at Class.open (composer.js:768)
    at composer.js:898
    at invokeCallback (rsvp.js:493)
    at rsvp.js:558
    at rsvp.js:19

Any ideas on how to fix?

[jordan-vidrine]

Sorry for your trouble here, I tried reproducing this on my local environment and could not get any errors. Would you mind updating to the latest commits from the main discourse branch repo and trying again?

Do you have any other components / themes installed as well? It might be helpful to turn all of those off and try this component alone to see if this continues to happen locally.

[JQ331]

Thanks very much. I don’t think the issue turns out to be with your theme component.

Rather, there is something strange going on with all my create topic buttons, even the default ones that appear with a fresh discourse install. I get that error: Uncaught Error: Assertion Failed: The key provided to set must be a string or number, you passed undefined...

I’m not sure what is going on. What happened:

1. Updated discourse and ember cli local install
2. I’m coding up a plugin–add that to the local instance. Going fine.
3. I tried to add a new create topic button to a page (unrelated to your component).
4. I added some composerController.open... code to that button.
5. maybe there was a typo in that code? not sure, but:
6. After that, ALL my create topic buttons stopped working, and produce that error.
7. This continues to happen even if I get rid of the code in my plugin.

Maybe it has to do with the composer’s “cache”? (I don’t know how the “cache” system works, but there must be something in place to allow the composer to remember, for example, if there is a draft in progress.)

Maybe when I tried to open the composer with the code w/typo, the composer got stuck with that code.

Would you know how to clear out the composer? (assuming that is the issue)