How to use the webext-options-sync function in webext-options-sync

async function init() {
	[options] = await Promise.all([
		new OptSync().getAll(),
		elementReady('.ajax-pagination-form')
	]);

	apply($('.account-switcher + *') || $('.news.column > :first-child'));

	const pages = [];

	// Prefetch all pages in parallel
	for (let i = 0; i < options.preloadPagesCount; i++) {
		pages.push(requestPage(i + 2));
	}

	// Append pages in series
	// uses the same method used by GitHub
	for (const page of pages) {
		// eslint-disable-next-line no-await-in-loop

export const getOptions = new Promise(async resolve => {
	// Options defaults
	const options = {
		...defaultConfigs,
		...await new OptionsSync().getAll()
	};

	if (options.customCSS.trim().length > 0) {
		const style = document.createElement('style');
		style.innerHTML = options.customCSS;
		document.head.append(style);
	}

	// Create logging function
	if (options.logging) {
		options.log = (method, ...content) => {
			console[method](...content);
		};
	} else {
		options.log = () => {};
	}

// I guess
        // TODO not sure why that in background was necessary..  none repeat scroll 0% 0%;
        // TODO add some docs on configuring it...
        extra_css   : `
.src {
    font-weight: bold;
}
/* you can use devtools to find out which CSS classes you can tweak */
`.trim(),
    };
}


// TODO mm. don't really like having global object, but seems that it's easiest way to avoid race conditions
// TODO https://github.com/fregante/webext-options-sync/issues/38 -- fixed now
const _options = new OptionsSync({
    defaults: defaultOptions(),
});


function optSync() {
    return _options;
}

export async function getOptions(): Promise {
    return await optSync().getAll();
}

// TODO legacy; remove
export async function get_options_async() {
    return await getOptions();
}

import {h} from 'dom-chef';
import select from 'select-dom';
import elementReady from 'element-ready';
import domLoaded from 'dom-loaded';
import OptionsSync from 'webext-options-sync';

let options;
const optionsPromise = new OptionsSync().getAll();

/**
 * Enable toggling each feature via options.
 * Prevent fn's errors from blocking the remaining tasks.
 * https://github.com/sindresorhus/refined-github/issues/678
 */
export const enableFeature = async ({fn, id: _featureId = fn.name}) => {
	if (!options) {
		options = await optionsPromise;
	}

	const {logging = false} = options;
	const log = logging ? console.log : () => {};

	const featureId = _featureId.replace(/_/g, '-');
	if (/^$|^anonymous$/.test(featureId)) {

import setLineLengthLimit from './limit-line-length'

import observeForWordDiffs from './observe-for-word-diffs'

import {
    isPullRequest,
    isCreatePullRequestURL,
    isPullRequestList,
    isCommit,
    isBranch,
    isComparePage,
} from './page-detect'

import addStyleToPage from './add-style'

new OptionsSync().getAll().then(options => {
    const config = {
        ...options,
        autocollapsePaths: (options.autocollapsePaths || '').split('\n'),
        ignorePaths: (options.ignorePaths || '').split('\n'),
    }

    init(config)
})

function init(config) {
    if (config.autolinker) {
        require('./vendor/prism-autolinker.min')
    }

    if (isBranch()) {
        codeReviewFeatures(config)

const indentWidthInput = document.querySelector('input[name="commentsIndentWidth"]');
indentWidthInput.addEventListener('input', () => {
	for (const tab of activeItemTabs) {
		browser.tabs.sendMessage(tab.id, {
			indentWidth: indentWidthInput.value
		});
	}
});

const links = document.querySelectorAll('a');
for (const link of links) {
	link.addEventListener('click', () => browser.tabs.create({url: link.href}));
}

new OptionsSync({logging: false}).syncForm('#options-form');

import OptSync from 'webext-options-sync';

new OptSync().define({
	defaults: {
		starredRepos: 'group',
		forkedRepos: 'group',
		newRepos: 'group',
		comments: 'group',
		newIssues: 'group',
		collaborators: 'hide',
		branches: 'hide',
		tags: 'hide',
		commits: 'hide',
		closedIssues: 'hide',
		preloadPagesCount: 0
	},
	migrations: [
		savedOptions => {
			if (savedOptions.hideCollaborators) {

form.id = 'hideReadStoriesForm';
	form.append(check, label);
	optionsBar.append(form);

	requestVisitedStories(options);
	check.addEventListener('input', () => {
		requestVisitedStories(options);
	});

	browser.runtime.onMessage.addListener(request => {
		if (request.visitedIds) {
			hideStories(request.visitedIds, check.checked);
		}
	});

	new OptionsSync({logging: false}).syncForm('#hideReadStoriesForm');
	return true;
}

input.addEventListener('input', () => {
		input.style.width = (input.value.length + 4) + 'ch';
	});

	form.addEventListener('change', () => {
		const isChecked = check.checked;
		input.disabled = !isChecked;

		if (!isChecked) {
			loader.classList.add('__rhn__no-display');
		}

		handleInterval(input, metadata.options, enabledOptions);
	});

	new OptionsSync({logging: false}).syncForm('#autoRefreshForm');
	return true;
}