Skip to content

Commit

Permalink
refactor: improve extensibility (#113)
Browse files Browse the repository at this point in the history
* refactor: improve extensibility

* chore

* chore: further improve extensibility

* chore
  • Loading branch information
DavideIadeluca authored Nov 29, 2024
1 parent 0604ce1 commit 155d615
Show file tree
Hide file tree
Showing 3 changed files with 71 additions and 52 deletions.
67 changes: 67 additions & 0 deletions js/src/forum/components/SolvedFilter.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,67 @@
import app from 'flarum/forum/app';
import Component, { ComponentAttrs } from 'flarum/common/Component';
import Dropdown from 'flarum/common/components/Dropdown';
import Button from 'flarum/common/components/Button';
import type Tag from 'flarum/tags/common/models/Tag';

export interface SolvedFilterAttrs extends ComponentAttrs {
alwaysShow?: boolean;
}

export default class SolvedFilter extends Component<SolvedFilterAttrs> {
view() {
if (!this.shouldShowFilter()) return null;

const selected = app.discussions.bestAnswer as unknown as number;
const options = ['all', 'solved', 'unsolved'];

return Dropdown.component(
{
buttonClassName: 'Button',
label: app.translator.trans(
`fof-best-answer.forum.filter.${options[selected] || Object.keys(options).map((key) => options[Number(key)])[0]}_label`
),
accessibleToggleLabel: app.translator.trans('fof-best-answer.forum.filter.accessible_label'),
},
Object.keys(options).map((value) => {
const label = options[Number(value)];
const active = (selected || Object.keys(options)[0]) === value;

return Button.component(
{
icon: active ? 'fas fa-check' : true,
active: active,
onclick: () => {
app.discussions.bestAnswer = value;
if (value === '0') {
delete app.discussions.bestAnswer;
}
app.discussions.refresh();
},
},
app.translator.trans(`fof-best-answer.forum.filter.${label}_label`)
);
})
);
}

shouldShowFilter() {
const { alwaysShow } = this.attrs;

if (alwaysShow) return true;

if (!app.forum.attribute('showBestAnswerFilterUi')) return false;

const tag: Tag = app.current.get('tag');

if (!tag?.isQnA?.()) {
if (app.discussions.bestAnswer) {
delete app.discussions.bestAnswer;
app.discussions.refresh();
}
return false;
}

return true;
}
}
2 changes: 2 additions & 0 deletions js/src/forum/components/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import SelectBestAnswerItem from './SelectBestAnswerItem';
import SelectBestAnswerNotification from './SelectBestAnswerNotification';
import SolutionSearchItem from './SolutionSearchItem';
import SolutionSearchSource from './SolutionSearchSource';
import SolvedFilter from './SolvedFilter';

export const components = {
SelectBestAnswerItem,
Expand All @@ -16,4 +17,5 @@ export const components = {
BestAnswerInDiscussionNotification,
SelectBestAnswerNotification,
SolutionSearchItem,
SolvedFilter,
};
54 changes: 2 additions & 52 deletions js/src/forum/extenders/extendIndexPage.tsx
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import app from 'flarum/forum/app';
import { extend } from 'flarum/common/extend';
import IndexPage from 'flarum/forum/components/IndexPage';
import Dropdown from 'flarum/common/components/Dropdown';
import Button from 'flarum/common/components/Button';
import SolvedFilter from '../components/SolvedFilter';

export default function extendIndexPage() {
extend(IndexPage.prototype, 'sidebarItems', function (items) {
Expand All @@ -22,55 +21,6 @@ export default function extendIndexPage() {
});

extend(IndexPage.prototype, 'viewItems', function (items) {
if (!app.forum.attribute('showBestAnswerFilterUi')) {
return;
}

const tag = this.currentTag();

if (!tag?.isQnA?.()) {
if (app.discussions.bestAnswer) {
delete app.discussions.bestAnswer;
app.discussions.refresh();
}

return;
}

const options = ['all', 'solved', 'unsolved'];

const selected = app.discussions.bestAnswer as unknown as number;

items.add(
'solved-filter',
Dropdown.component(
{
buttonClassName: 'Button',
label: app.translator.trans(
`fof-best-answer.forum.filter.${options[selected] || Object.keys(options).map((key) => options[Number(key)])[0]}_label`
),
accessibleToggleLabel: app.translator.trans('fof-best-answer.forum.filter.accessible_label'),
},
Object.keys(options).map((value) => {
const label = options[Number(value)];
const active = (selected || Object.keys(options)[0]) === value;

return Button.component(
{
icon: active ? 'fas fa-check' : true,
active: active,
onclick: () => {
app.discussions.bestAnswer = value;
if (value === '0') {
delete app.discussions.bestAnswer;
}
app.discussions.refresh();
},
},
app.translator.trans(`fof-best-answer.forum.filter.${label}_label`)
);
})
)
);
items.add('solved-filter', <SolvedFilter />);
});
}

0 comments on commit 155d615

Please sign in to comment.