How to use piral-core - 10 common examples

return (
    <div>
      
      <div>
        <h1>Sample Portal ({layout})</h1>
        
        <menu>
      </menu></div>
      <div>{children}</div>
      <div>For more information or the source code check out our GitHub repository.</div>
    </div>
  );
};

const Portal = createInstance({
  availableModules: modules,
  requestModules() {
    // return fetch('http://localhost:9000/api/pilet')
    //   .then(res =&gt; res.json())
    //   .then(res =&gt; res.items);
    return new Promise(resolve =&gt; setTimeout(() =&gt; resolve([]), 1000));
  },
  Loader,
  routes: {
    '/sitemap': Sitemap,
  },
});

const App: React.SFC = () =&gt; {content =&gt; {content}};

render(, document.querySelector('#app'));

return (
    <div>
      
      <div>
        <h1>Sample Portal ({layout})</h1>
        
        <menu>
      </menu></div>
      <div>{children}</div>
      <div>For more information or the source code check out our GitHub repository.</div>
    </div>
  );
};

const instance = createInstance({
  availablePilets,
  extendApi: [
    createMenuApi(),
    createNotificationsApi(),
    createContainersApi(),
    createDashboardApi(),
    createFeedsApi(),
    createFormsApi(),
    createSearchApi(),
  ],
  requestPilets() {
    // return fetch('http://localhost:9000/api/pilet')
    //   .then(res =&gt; res.json())
    //   .then(res =&gt; res.items);
    return new Promise(resolve =&gt; setTimeout(() =&gt; resolve([]), 1000));
  },

export function useDynamicLanguage(
  defaultSelected: string,
  load: LanguageLoader,
): [string, (language: string) => void] {
  const [selected, setSelected] = useState(defaultSelected);
  const { selectLanguage, setLoading, setTranslations, getTranslations } = useActions();

  useEffect(() => {
    let active = true;
    const current = getTranslations(selected);
    selectLanguage(undefined);
    setLoading(true);
    load(selected, current)
      .then(
        result => {
          if (active) {
            setTranslations(selected, result);
            selectLanguage(selected);
          }
        },
        err => console.error(err),
      )

const Sitemap: React.SFC = () => {
  const pages = useGlobalState(s => s.components.pages);

  return (
    <ul>
      <li>
        Go to /
      </li>
      {Object.keys(pages)
        .map(url =&gt; url.replace(':id', `${~~(Math.random() * 1000)}`))
        .map(url =&gt; (
          <li>
            Go to {url}
          </li>
        ))}
      <li>
        Go to /sitemap
      </li></ul>

export function useForm(
  initialData: TFormData,
  history: History,
  options: InputFormOptions,
  existingId?: string,
) {
  const { silent, message } = options;
  const [id] = useState(existingId || generateId);
  const state = useGlobalState(m => m.forms[id] || createDefaultState(initialData));
  const updateState = useAction('updateFormState');
  usePrompt(!silent && state.changed, history, message);
  useEffect(() => {
    updateState(id, state, {
      active: true,
    });

    return () =>
      updateState(id, state, {
        active: false,
      });
  }, [state.submitting]);
  return createProps(id, state, updateState, options);
}

const Sitemap: React.FC = () => {
  const pages = useGlobalState(s => s.registry.pages);

  return (
    <ul>
      <li>
        Go to /
      </li>
      {Object.keys(pages)
        .map(url =&gt; url.replace(':id', `${~~(Math.random() * 1000)}`))
        .map(url =&gt; (
          <li>
            Go to {url}
          </li>
        ))}
      <li>
        Go to /sitemap
      </li></ul>

export const SwitchErrorInfo: React.FC = props => {
  const components = useGlobalState(m => m.components);

  switch (props.type) {
    case 'not_found':
      return renderComponent(components, 'NotFoundErrorInfo', props);
    case 'page':
      return renderComponent(components, 'PageErrorInfo', props);
    case 'tile':
      return renderComponent(components, 'TileErrorInfo', props);
    case 'menu':
      return renderComponent(components, 'MenuErrorInfo', props);
    case 'extension':
      return renderComponent(components, 'ExtensionErrorInfo', props);
    case 'modal':
      return renderComponent(components, 'ModalErrorInfo', props);
    case 'loading':
      return renderComponent(components, 'LoadingErrorInfo', props);

const Sitemap: React.FC = () => {
  const pages = useGlobalState(s => s.registry.pages);

  return (
    <ul>
      <li>
        Go to /
      </li>
      {Object.keys(pages)
        .map(url =&gt; url.replace(':id', `${~~(Math.random() * 1000)}`))
        .map(url =&gt; (
          <li>
            Go to {url}
          </li>
        ))}
      <li>
        Go to /sitemap
      </li></ul>

export function useTranslation() {
  const { selected, translations } = useGlobalState(m => m.app.language);
  return translations[selected];
}