UI crashes due js translation error

AI-generated summary

The discussion revolves around a UI crash issue due to a JavaScript translation error. eagleeye reported the issue after updating the system, which hangs on the initial loading screen with an error message related to index.js.

eagleeye suspected the issue was related to a translation error but was unsure how to resolve it. JammyDodger suggested accessing the site in safe mode, which helped eagleeye identify the problematic theme component.

The solution was found to be an outdated plugin for custom menu items that eagleeye had added but forgotten about. JammyDodger commended the use of safe mode in resolving the issue.

I’ve updated today, since then I’m not able to access the system.
It hangs on the initial loading screen due this error:

index.js:301 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'split')
    at s.lookup (index.js:301:19)
    at s.findTranslation (index.js:265:28)
    at s._translate (index.js:72:28)
    at s.<anonymous> (index.js:30:40)
    at Pe._deprecateDecoratingHamburgerWidgetLinks (plugin-api.js:545:44)
    at Pe.decorateWidget (plugin-api.js:522:10)
    at navigation.js:15:1
    at Oe (plugin-api.js:2614:12)
    at Object.initialize (navigation.js:14:1)
    at n.initialize (app.js:201:28)
    at index.js:126:1
    at e.each (dag-map.js:191:1)
    at e.walk (dag-map.js:120:1)
    at e.each (dag-map.js:66:1)
    at e.topsort (dag-map.js:72:1)
    at e._runInitializer (index.js:138:1)
    at e.runInstanceInitializers (index.js:124:1)
    at e._bootSync (instance.js:101:1)
    at e.didBecomeReady (application.js:656:1)
    at p.invoke (queue.ts:201:14)
    at p.flush (queue.ts:98:13)
    at h.flush (deferred-action-queues.ts:75:19)
    at $._end (index.ts:616:32)
    at _boundAutorunEnd (index.ts:257:12)

I found that this occurs due

define("discourse/plugins/navigation/discourse/initializers/navigation", ["exports", "discourse/lib/plugin-api"], function (_exports, _pluginApi) {
  "use strict";

  Object.defineProperty(_exports, "__esModule", {
    value: true
  });
  _exports.default = void 0;
  var _default = _exports.default = {
    name: 'navigation',
    hamburger_general: [],
    hamburger_footer: [],
    initialize(container) {
      var self = this;
      (0, _pluginApi.withPluginApi)('0.4', api => {
        api.decorateWidget("hamburger-menu:generalLinks", () => {
          return self.hamburger_general;
        });
        api.decorateWidget("hamburger-menu:footerLinks", () => {
          return self.hamburger_footer;
        });
        const store = container.lookup('store:main');
        store.findAll('menu-link').then(function (rs) {
          rs.content.forEach(function (l) {
            if (l.visible_hamburger_general) {
              self.hamburger_general.push({
                href: l.url,
                rawLabel: l.name
              });
            }
            if (l.visible_hamburger_footer) {
              self.hamburger_footer.push({
                href: l.url,
                rawLabel: l.name
              });
            }
          });
        });
      });
    }
  };
});

I’m a bit lost how to solve it, after rebuild it still remains.

Can you access the site in safe mode?

It looks like you may have a hamburger-related theme component that’s acting up.

:smiley: perfect thats the option I had a look for and was to blind to find.
Now I can see what I have to change in the config

Ok the solution was, I had added a plugin for custom menu items
But its to old and I forgot about it

Safe mode for the win. :medal_sports: :slight_smile: I’m glad you got it sorted. :+1: