{"id":45999017,"url":"https://github.com/android-com-pl/mobile-tab","last_synced_at":"2026-02-28T22:01:13.205Z","repository":{"id":44883925,"uuid":"387091259","full_name":"android-com-pl/mobile-tab","owner":"android-com-pl","description":"Flarum extension. Adds a bottom tab on mobile","archived":false,"fork":false,"pushed_at":"2026-02-01T00:08:48.000Z","size":3644,"stargazers_count":10,"open_issues_count":0,"forks_count":6,"subscribers_count":3,"default_branch":"2.x","last_synced_at":"2026-02-01T08:07:54.092Z","etag":null,"topics":["flarum","flarum-extension","hacktoberfest","navigation"],"latest_commit_sha":null,"homepage":"https://discuss.flarum.org/d/28216-mobile-tab","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/android-com-pl.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null},"funding":{"github":["android-com-pl","rafaucau"]}},"created_at":"2021-07-18T04:41:32.000Z","updated_at":"2026-02-01T00:08:52.000Z","dependencies_parsed_at":"2024-04-06T16:27:34.622Z","dependency_job_id":"829753f7-2e03-4bc4-a9fa-f4d1bd090b6d","html_url":"https://github.com/android-com-pl/mobile-tab","commit_stats":{"total_commits":36,"total_committers":5,"mean_commits":7.2,"dds":"0.33333333333333337","last_synced_commit":"7b178b3d55abc7d7cf15f64b08bcdb2f60919338"},"previous_names":[],"tags_count":24,"template":false,"template_full_name":null,"purl":"pkg:github/android-com-pl/mobile-tab","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/android-com-pl%2Fmobile-tab","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/android-com-pl%2Fmobile-tab/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/android-com-pl%2Fmobile-tab/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/android-com-pl%2Fmobile-tab/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/android-com-pl","download_url":"https://codeload.github.com/android-com-pl/mobile-tab/tar.gz/refs/heads/2.x","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/android-com-pl%2Fmobile-tab/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29953212,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-28T18:42:55.706Z","status":"ssl_error","status_checked_at":"2026-02-28T18:42:48.811Z","response_time":90,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["flarum","flarum-extension","hacktoberfest","navigation"],"created_at":"2026-02-28T22:01:12.608Z","updated_at":"2026-02-28T22:01:13.194Z","avatar_url":"https://github.com/android-com-pl.png","language":"TypeScript","funding_links":["https://github.com/sponsors/android-com-pl","https://github.com/sponsors/rafaucau"],"categories":[],"sub_categories":[],"readme":"# Mobile Tab Component\n\n![License](https://img.shields.io/badge/license-MIT-blue.svg) [![Latest Stable Version](https://img.shields.io/packagist/v/acpl/mobile-tab.svg)](https://packagist.org/packages/acpl/mobile-tab) [![Total Downloads](https://img.shields.io/packagist/dt/acpl/mobile-tab.svg)](https://packagist.org/packages/acpl/mobile-tab/stats) [![GitHub Sponsors](https://img.shields.io/badge/Donate-%E2%9D%A4-%23db61a2.svg?\u0026logo=github\u0026logoColor=white\u0026labelColor=181717)](https://github.com/android-com-pl/mobile-tab?sponsor=1)\n\nA [Flarum](https://flarum.org) extension. Adds a bottom tab on mobile.\n\n![Imgur](https://i.imgur.com/QGrWQyP.png)\n\n## Installation\n\nInstall with composer:\n\n```sh\ncomposer require acpl/mobile-tab\n```\n\n## Updating\n\n```sh\ncomposer update acpl/mobile-tab\nphp flarum migrate\nphp flarum cache:clear\n```\n\n## Extending\n\n\u003e [!IMPORTANT]  \n\u003e These instructions are for Flarum 2.0.\n\u003e For Flarum 1.x documentation, please refer to:\n\u003e [Flarum 1.x Guide](https://github.com/android-com-pl/mobile-tab/tree/1.x?tab=readme-ov-file#extending)\n\nYou can add, modify, and delete items in the mobile tab using your own extension.\nRead: [https://docs.flarum.org/2.x/extend/extending-extensions](https://docs.flarum.org/2.x/extend/extending-extensions/)\n\n1. Install `acpl/mobile-tab` as your extension's composer dependency or add it as an [optional dependency](https://docs.flarum.org/2.x/extend/extending-extensions/#optional-dependencies) in your `composer.json`.\n2. In the `tsconfig.json` file add `\"ext:acpl/mobile-tab/*\": [\"../vendor/acpl/mobile-tab/js/dist-typings/*\"]` to the `compilerOptions.paths` object.\n3. You can now import and use the registry classes to modify the mobile tab.\n\n### Example\n\nCreate `extendMobile.ts` in your extension's `js/common` directory:\n\n```tsx\nimport MobileTabItemsRegistry from \"ext:acpl/mobile-tab/common/MobileTabItemsRegistry\";\nimport app from \"flarum/common/app\";\nimport { extend } from \"flarum/common/extend\";\n\nexport default () =\u003e {\n  extend(MobileTabItemsRegistry.prototype, \"items\", (items) =\u003e {\n    // Add a simple link item\n    items.add(\"following\", {\n      icon: \"fas fa-star\",\n      label: app.translator.trans(\"my-ext.forum.index.following_label\"),\n      href: () =\u003e app.route(\"following\"),\n      canView: () =\u003e !!app.session.user,\n      source: \"extension\",\n    });\n\n    // Add an item that we plan to turn into an interactive component on the forum frontend\n    items.add(\"my-interactive-item\", {\n      icon: \"fas fa-rocket\",\n      label: app.translator.trans(\"my-ext.forum.my_interactive_item_label\"),\n      source: \"extension\",\n    });\n  });\n};\n```\n\nUse this file in both admin and forum. Example for the admin side:\n\n```tsx\nimport app from \"flarum/admin/app\";\nimport extendMobileTab from \"../common/extendMobileTab\";\n\napp.initializers.add(\"my-ext/mobile-tab-example\", () =\u003e {\n  extendMobileTab();\n  // ... other initializers\n});\n```\n\nTo make an item interactive on the forum, assign a component using the `forumComponent` property.\n\n\u003e [!NOTE]  \n\u003e Interactive components should be registered in `MobileTabItemsRegistryForum` because they import `from flarum/forum/*`.\n\u003e Registering them in the common registry would break the admin panel.\n\n```tsx\nimport MobileTabItemsRegistryForum from \"ext:acpl/mobile-tab/forum/data/MobileTabItemsRegistryForum\";\nimport { extend } from \"flarum/common/extend\";\nimport app from \"flarum/forum/app\";\nimport extendMobileTab from \"../common/extendMobileTab\";\nimport MyCustomTabItem from \"./components/MyCustomTabItem\";\n\napp.initializers.add(\"my-ext/mobile-tab-example\", () =\u003e {\n  extendMobileTab();\n\n  extend(MobileTabItemsRegistryForum.prototype, \"items\", (items) =\u003e {\n    // Get the item defined in common and enhance it for the forum\n    const myItem = items.get(\"my-interactive-item\");\n\n    items.setContent(\"my-interactive-item\", {\n      ...myItem, // Keep icon, label, and other shared properties\n      forumComponent: MyCustomTabItem, // Add the forum-only interactive component\n    });\n  });\n  // ... other initializers\n});\n```\n\n```tsx\nimport MobileTabComponent from \"ext:acpl/mobile-tab/common/components/MobileTabComponent\";\nimport Button from \"flarum/common/components/Button\";\n\nexport default class MyCustomTabItem extends MobileTabComponent {\n  view() {\n    const { icon, label } = this.attrs.definition;\n\n    return (\n      \u003cButton\n        className=\"Button MyCustomTabComponent\"\n        icon={icon}\n        onclick={() =\u003e console.log(\"clicked\")}\n      \u003e\n        {label}\n      \u003c/Button\u003e\n    );\n  }\n}\n```\n\n## Links\n\n- [Packagist](https://packagist.org/packages/acpl/mobile-tab)\n- [GitHub](https://github.com/android-com-pl/mobile-tab)\n- [Discuss](https://discuss.flarum.org/d/28216-mobile-tab)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandroid-com-pl%2Fmobile-tab","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fandroid-com-pl%2Fmobile-tab","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fandroid-com-pl%2Fmobile-tab/lists"}