mirror of
https://github.com/directus/directus.git
synced 2026-02-15 04:25:03 -05:00
New OpenID and OAuth2 drivers (#8660)
* Moved over oauth impl to new interface * Fixed most build issues and started addind schema to auth drivers * Finished up OAuth2 and OpenID drivers * Removed unused migration and utils * Fixed minor todos * Removed old oauth flow * Changed oauth flow to re-use refresh token * Added new oauth frontend * Added font awesome social icons * Updated authentication documentation * Update api/src/auth/drivers/oauth2.ts * Tested implementation and fixed incorrect validation * Updated docs * Improved OAuth error handling and re-enabled creating users with provider/identifier * Removed Session config from docs * Update app/src/components/v-icon/v-icon.vue * Removed oauth need to define default roleID * Added FormatTitle to SSO links * Prevent local auth without password * Store OAuth access token in session data * Update docs/guides/api-config.md * Fixed copy and removed fontawesome-vue dependency * More docs fixes * Crucialy importend type fiks * Update package-lock * Remove is-email-allowed check In favor of more advanced version based on filtering coming later * Fix JSON type casting * Delete unused util * Update type signature to include name * Add warning when code isn't found in oauth url and remove obsolete imports * Auto-continue on successful SSO login * Tweak type signature * More type casting shenanigans * Please the TS gods * Check for missing token before crashing Co-authored-by: rijkvanzanten <rijkvanzanten@me.com>
This commit is contained in:
Aiden Foxx
@@ -8,12 +8,15 @@
|
||||
@click="emitClick"
|
||||
>
|
||||
<component :is="customIconName" v-if="customIconName" />
|
||||
<socialIcon v-else-if="socialIconName" :name="socialIconName" />
|
||||
<i v-else :class="{ filled }">{{ name }}</i>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, computed } from 'vue';
|
||||
import { defineComponent, computed, h, PropType } from 'vue';
|
||||
import { library, icon, findIconDefinition, IconName } from '@fortawesome/fontawesome-svg-core';
|
||||
import { fab } from '@fortawesome/free-brands-svg-icons';
|
||||
import useSizeClass, { sizeProps } from '@/composables/size-class';
|
||||
|
||||
import CustomIconDirectus from './custom-icons/directus.vue';
|
||||
@@ -35,6 +38,8 @@ import CustomIconFolderMove from './custom-icons/folder_move.vue';
|
||||
import CustomIconFolderLock from './custom-icons/folder_lock.vue';
|
||||
import CustomIconLogout from './custom-icons/logout.vue';
|
||||
|
||||
library.add(fab);
|
||||
|
||||
const customIcons: string[] = [
|
||||
'directus',
|
||||
'bookmark_save',
|
||||
@@ -56,6 +61,478 @@ const customIcons: string[] = [
|
||||
'logout',
|
||||
];
|
||||
|
||||
const socialIcons: string[] = [
|
||||
'500px',
|
||||
'accessible_icon',
|
||||
'accusoft',
|
||||
'acquisitions_incorporated',
|
||||
'adn',
|
||||
'adversal',
|
||||
'affiliatetheme',
|
||||
'airbnb',
|
||||
'algolia',
|
||||
'alipay',
|
||||
'amazon',
|
||||
'amazon_pay',
|
||||
'amilia',
|
||||
'android',
|
||||
'angellist',
|
||||
'angrycreative',
|
||||
'angular',
|
||||
'app_store',
|
||||
'app_store_ios',
|
||||
'apper',
|
||||
'apple',
|
||||
'apple_pay',
|
||||
'artstation',
|
||||
'asymmetrik',
|
||||
'atlassian',
|
||||
'audible',
|
||||
'autoprefixer',
|
||||
'avianex',
|
||||
'aviato',
|
||||
'aws',
|
||||
'bandcamp',
|
||||
'battle_net',
|
||||
'behance',
|
||||
'behance_square',
|
||||
'bimobject',
|
||||
'bitbucket',
|
||||
'bitcoin',
|
||||
'bity',
|
||||
'black_tie',
|
||||
'blackberry',
|
||||
'blogger',
|
||||
'blogger_b',
|
||||
'bluetooth',
|
||||
'bluetooth_b',
|
||||
'bootstrap',
|
||||
'btc',
|
||||
'buffer',
|
||||
'buromobelexperte',
|
||||
'buy_n_large',
|
||||
'buysellads',
|
||||
'canadian_maple_leaf',
|
||||
'cc_amazon_pay',
|
||||
'cc_amex',
|
||||
'cc_apple_pay',
|
||||
'cc_diners_club',
|
||||
'cc_discover',
|
||||
'cc_jcb',
|
||||
'cc_mastercard',
|
||||
'cc_paypal',
|
||||
'cc_stripe',
|
||||
'cc_visa',
|
||||
'centercode',
|
||||
'centos',
|
||||
'chrome',
|
||||
'chromecast',
|
||||
'cloudflare',
|
||||
'cloudscale',
|
||||
'cloudsmith',
|
||||
'cloudversify',
|
||||
'codepen',
|
||||
'codiepie',
|
||||
'confluence',
|
||||
'connectdevelop',
|
||||
'contao',
|
||||
'cotton_bureau',
|
||||
'cpanel',
|
||||
'creative_commons',
|
||||
'creative_commons_by',
|
||||
'creative_commons_nc',
|
||||
'creative_commons_nc_eu',
|
||||
'creative_commons_nc_jp',
|
||||
'creative_commons_nd',
|
||||
'creative_commons_pd',
|
||||
'creative_commons_pd_alt',
|
||||
'creative_commons_remix',
|
||||
'creative_commons_sa',
|
||||
'creative_commons_sampling',
|
||||
'creative_commons_sampling_plus',
|
||||
'creative_commons_share',
|
||||
'creative_commons_zero',
|
||||
'critical_role',
|
||||
'css3',
|
||||
'css3_alt',
|
||||
'cuttlefish',
|
||||
'd_and_d',
|
||||
'd_and_d_beyond',
|
||||
'dailymotion',
|
||||
'dashcube',
|
||||
'deezer',
|
||||
'delicious',
|
||||
'deploydog',
|
||||
'deskpro',
|
||||
'dev',
|
||||
'deviantart',
|
||||
'dhl',
|
||||
'diaspora',
|
||||
'digg',
|
||||
'digital_ocean',
|
||||
'discord',
|
||||
'discourse',
|
||||
'dochub',
|
||||
'docker',
|
||||
'draft2digital',
|
||||
'dribbble',
|
||||
'dribbble_square',
|
||||
'dropbox',
|
||||
'drupal',
|
||||
'dyalog',
|
||||
'earlybirds',
|
||||
'ebay',
|
||||
'edge',
|
||||
'edge_legacy',
|
||||
'elementor',
|
||||
'ello',
|
||||
'ember',
|
||||
'empire',
|
||||
'envira',
|
||||
'erlang',
|
||||
'ethereum',
|
||||
'etsy',
|
||||
'evernote',
|
||||
'expeditedssl',
|
||||
'facebook',
|
||||
'facebook_f',
|
||||
'facebook_messenger',
|
||||
'facebook_square',
|
||||
'fantasy_flight_games',
|
||||
'fedex',
|
||||
'fedora',
|
||||
'figma',
|
||||
'firefox',
|
||||
'firefox_browser',
|
||||
'first_order',
|
||||
'first_order_alt',
|
||||
'firstdraft',
|
||||
'flickr',
|
||||
'flipboard',
|
||||
'fly',
|
||||
'font_awesome',
|
||||
'font_awesome_alt',
|
||||
'font_awesome_flag',
|
||||
'fonticons',
|
||||
'fonticons_fi',
|
||||
'fort_awesome',
|
||||
'fort_awesome_alt',
|
||||
'forumbee',
|
||||
'foursquare',
|
||||
'free_code_camp',
|
||||
'freebsd',
|
||||
'fulcrum',
|
||||
'galactic_republic',
|
||||
'galactic_senate',
|
||||
'get_pocket',
|
||||
'gg',
|
||||
'gg_circle',
|
||||
'git',
|
||||
'git_alt',
|
||||
'git_square',
|
||||
'github',
|
||||
'github_alt',
|
||||
'github_square',
|
||||
'gitkraken',
|
||||
'gitlab',
|
||||
'gitter',
|
||||
'glide',
|
||||
'glide_g',
|
||||
'gofore',
|
||||
'goodreads',
|
||||
'goodreads_g',
|
||||
'google',
|
||||
'google_drive',
|
||||
'google_pay',
|
||||
'google_play',
|
||||
'google_plus',
|
||||
'google_plus_g',
|
||||
'google_plus_square',
|
||||
'google_wallet',
|
||||
'gratipay',
|
||||
'grav',
|
||||
'gripfire',
|
||||
'grunt',
|
||||
'guilded',
|
||||
'gulp',
|
||||
'hacker_news',
|
||||
'hacker_news_square',
|
||||
'hackerrank',
|
||||
'hips',
|
||||
'hire_a_helper',
|
||||
'hive',
|
||||
'hooli',
|
||||
'hornbill',
|
||||
'hotjar',
|
||||
'houzz',
|
||||
'html5',
|
||||
'hubspot',
|
||||
'ideal',
|
||||
'imdb',
|
||||
'innosoft',
|
||||
'instagram',
|
||||
'instagram_square',
|
||||
'instalod',
|
||||
'intercom',
|
||||
'internet_explorer',
|
||||
'invision',
|
||||
'ioxhost',
|
||||
'itch_io',
|
||||
'itunes',
|
||||
'itunes_note',
|
||||
'java',
|
||||
'jedi_order',
|
||||
'jenkins',
|
||||
'jira',
|
||||
'joget',
|
||||
'joomla',
|
||||
'js',
|
||||
'js_square',
|
||||
'jsfiddle',
|
||||
'kaggle',
|
||||
'keybase',
|
||||
'keycdn',
|
||||
'kickstarter',
|
||||
'kickstarter_k',
|
||||
'korvue',
|
||||
'laravel',
|
||||
'lastfm',
|
||||
'lastfm_square',
|
||||
'leanpub',
|
||||
'less',
|
||||
'line',
|
||||
'linkedin',
|
||||
'linkedin_in',
|
||||
'linode',
|
||||
'linux',
|
||||
'lyft',
|
||||
'magento',
|
||||
'mailchimp',
|
||||
'mandalorian',
|
||||
'markdown',
|
||||
'mastodon',
|
||||
'maxcdn',
|
||||
'mdb',
|
||||
'medapps',
|
||||
'medium',
|
||||
'medium_m',
|
||||
'medrt',
|
||||
'meetup',
|
||||
'megaport',
|
||||
'mendeley',
|
||||
'microblog',
|
||||
'microsoft',
|
||||
'mix',
|
||||
'mixcloud',
|
||||
'mixer',
|
||||
'mizuni',
|
||||
'modx',
|
||||
'monero',
|
||||
'napster',
|
||||
'neos',
|
||||
'nimblr',
|
||||
'node',
|
||||
'node_js',
|
||||
'npm',
|
||||
'ns8',
|
||||
'nutritionix',
|
||||
'octopus_deploy',
|
||||
'odnoklassniki',
|
||||
'odnoklassniki_square',
|
||||
'old_republic',
|
||||
'opencart',
|
||||
'openid',
|
||||
'opera',
|
||||
'optin_monster',
|
||||
'orcid',
|
||||
'osi',
|
||||
'page4',
|
||||
'pagelines',
|
||||
'palfed',
|
||||
'patreon',
|
||||
'paypal',
|
||||
'penny_arcade',
|
||||
'perbyte',
|
||||
'periscope',
|
||||
'phabricator',
|
||||
'phoenix_framework',
|
||||
'phoenix_squadron',
|
||||
'php',
|
||||
'pied_piper',
|
||||
'pied_piper_alt',
|
||||
'pied_piper_hat',
|
||||
'pied_piper_pp',
|
||||
'pied_piper_square',
|
||||
'pinterest',
|
||||
'pinterest_p',
|
||||
'pinterest_square',
|
||||
'playstation',
|
||||
'product_hunt',
|
||||
'pushed',
|
||||
'python',
|
||||
'qq',
|
||||
'quinscape',
|
||||
'quora',
|
||||
'r_project',
|
||||
'raspberry_pi',
|
||||
'ravelry',
|
||||
'react',
|
||||
'reacteurope',
|
||||
'readme',
|
||||
'rebel',
|
||||
'red_river',
|
||||
'reddit',
|
||||
'reddit_alien',
|
||||
'reddit_square',
|
||||
'redhat',
|
||||
'renren',
|
||||
'replyd',
|
||||
'researchgate',
|
||||
'resolving',
|
||||
'rev',
|
||||
'rocketchat',
|
||||
'rockrms',
|
||||
'rust',
|
||||
'safari',
|
||||
'salesforce',
|
||||
'sass',
|
||||
'schlix',
|
||||
'scribd',
|
||||
'searchengin',
|
||||
'sellcast',
|
||||
'sellsy',
|
||||
'servicestack',
|
||||
'shirtsinbulk',
|
||||
'shopify',
|
||||
'shopware',
|
||||
'simplybuilt',
|
||||
'sistrix',
|
||||
'sith',
|
||||
'sketch',
|
||||
'skyatlas',
|
||||
'skype',
|
||||
'slack',
|
||||
'slack_hash',
|
||||
'slideshare',
|
||||
'snapchat',
|
||||
'snapchat_ghost',
|
||||
'snapchat_square',
|
||||
'soundcloud',
|
||||
'sourcetree',
|
||||
'speakap',
|
||||
'speaker_deck',
|
||||
'spotify',
|
||||
'squarespace',
|
||||
'stack_exchange',
|
||||
'stack_overflow',
|
||||
'stackpath',
|
||||
'staylinked',
|
||||
'steam',
|
||||
'steam_square',
|
||||
'steam_symbol',
|
||||
'sticker_mule',
|
||||
'strava',
|
||||
'stripe',
|
||||
'stripe_s',
|
||||
'studiovinari',
|
||||
'stumbleupon',
|
||||
'stumbleupon_circle',
|
||||
'superpowers',
|
||||
'supple',
|
||||
'suse',
|
||||
'swift',
|
||||
'symfony',
|
||||
'teamspeak',
|
||||
'telegram',
|
||||
'telegram_plane',
|
||||
'tencent_weibo',
|
||||
'the_red_yeti',
|
||||
'themeco',
|
||||
'themeisle',
|
||||
'think_peaks',
|
||||
'tiktok',
|
||||
'trade_federation',
|
||||
'trello',
|
||||
'tumblr',
|
||||
'tumblr_square',
|
||||
'twitch',
|
||||
'twitter',
|
||||
'twitter_square',
|
||||
'typo3',
|
||||
'uber',
|
||||
'ubuntu',
|
||||
'uikit',
|
||||
'umbraco',
|
||||
'uncharted',
|
||||
'uniregistry',
|
||||
'unity',
|
||||
'unsplash',
|
||||
'untappd',
|
||||
'ups',
|
||||
'usb',
|
||||
'usps',
|
||||
'ussunnah',
|
||||
'vaadin',
|
||||
'viacoin',
|
||||
'viadeo',
|
||||
'viadeo_square',
|
||||
'viber',
|
||||
'vimeo',
|
||||
'vimeo_square',
|
||||
'vimeo_v',
|
||||
'vine',
|
||||
'vk',
|
||||
'vnv',
|
||||
'vuejs',
|
||||
'watchman_monitoring',
|
||||
'waze',
|
||||
'weebly',
|
||||
'weibo',
|
||||
'weixin',
|
||||
'whatsapp',
|
||||
'whatsapp_square',
|
||||
'whmcs',
|
||||
'wikipedia_w',
|
||||
'windows',
|
||||
'wix',
|
||||
'wizards_of_the_coast',
|
||||
'wodu',
|
||||
'wolf_pack_battalion',
|
||||
'wordpress',
|
||||
'wordpress_simple',
|
||||
'wpbeginner',
|
||||
'wpexplorer',
|
||||
'wpforms',
|
||||
'wpressr',
|
||||
'xbox',
|
||||
'xing',
|
||||
'xing_square',
|
||||
'y_combinator',
|
||||
'yahoo',
|
||||
'yammer',
|
||||
'yandex',
|
||||
'yandex_international',
|
||||
'yarn',
|
||||
'yelp',
|
||||
'yoast',
|
||||
'youtube',
|
||||
'youtube_square',
|
||||
'zhihu',
|
||||
];
|
||||
|
||||
const SocialIcon = defineComponent({
|
||||
props: {
|
||||
name: {
|
||||
type: String as PropType<IconName>,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
render() {
|
||||
const socialIcon = icon(findIconDefinition({ prefix: 'fab', iconName: this.name }));
|
||||
return h({ template: socialIcon?.html[0] });
|
||||
},
|
||||
});
|
||||
|
||||
export default defineComponent({
|
||||
components: {
|
||||
CustomIconDirectus,
|
||||
@@ -76,6 +553,7 @@ export default defineComponent({
|
||||
CustomIconFolderMove,
|
||||
CustomIconFolderLock,
|
||||
CustomIconLogout,
|
||||
SocialIcon,
|
||||
},
|
||||
props: {
|
||||
name: {
|
||||
@@ -125,9 +603,15 @@ export default defineComponent({
|
||||
return null;
|
||||
});
|
||||
|
||||
const socialIconName = computed<string | null>(() => {
|
||||
if (socialIcons.includes(props.name)) return props.name.replace(/_/g, '-');
|
||||
return null;
|
||||
});
|
||||
|
||||
return {
|
||||
sizeClass,
|
||||
customIconName,
|
||||
socialIconName,
|
||||
emitClick,
|
||||
};
|
||||
|
||||
@@ -182,6 +666,11 @@ body {
|
||||
display: inline-block;
|
||||
color: inherit;
|
||||
fill: currentColor;
|
||||
|
||||
&.svg-inline--fa {
|
||||
width: auto;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
&.has-click {
|
||||
|
||||
Reference in New Issue
Block a user