Skip to content
This repository was archived by the owner on Jul 7, 2025. It is now read-only.
This repository was archived by the owner on Jul 7, 2025. It is now read-only.

[web] Not coming out of loadingComponent #26

Description

@FacuM

Expected behavior:

RemoteComponent should come out of loadingComponent after receiveing valid bundled Javascript.

Current behavior:

RemoteComponent hangs in the loading state, displaying loadingComponent indefinitely.

Code sample:

// Plugin.js (plugin loader)
import { View } from 'react-native';
import { ActivityIndicator, Icon, Text } from 'react-native-paper';
import { RemoteComponent } from 'react-native-remote-ui';

import TextBold from '../TextBold';

const Plugin = ({ name }) => {
    return (
        <RemoteComponent
            source={{ uri: `/backend/api/plugins/${name}/ui` }}
            loadingComponent={<ActivityIndicator size='small' />}
            errorComponent={
                <View>
                    <Icon source='alert' />
                    <Text>
                        Couldn't load <TextBold>{name}</TextBold>!
                    </Text>
                </View>
            }
            fallbackComponent={
                <View>
                    <Icon source='alert' />
                    <Text>
                        Couldn't load <TextBold>{name}</TextBold>!
                    </Text>
                </View>
            }
        />
    );
};

export default Plugin;
// Main.js (sample plugin: base code)
export const HomeComponent = () => {
    return (
      <View>
        <Text> Remote Component </Text>
      </View>
    );
};
# Bundler command
npx babel --presets=@babel/preset-env,@babel/preset-react plugins/Test/src/ui/navbar/Main.jsx -o plugin
s/Test/src/ui/navbar/Main.js
// Main.js (sample plugin: bundled code) - this is the code received from /backend/api/plugins/${name}/ui
"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
var HomeComponent = function HomeComponent() {
  return React.createElement(
    View,
    null,
    React.createElement(
      Text,
      null,
      " Remote Component "
    )
  );
};
exports.HomeComponent = HomeComponent;
// NavBar.jsx (attempts to load the sample plugin)
<Plugin name='TestPlugin' />

The console doesn't display anything related to [RemoteComponent] and no errors are being logged.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions