Skip to content

Commit

Permalink
Merge pull request #36 from SE-Project-CMP-Tumbler/settings
Browse files Browse the repository at this point in the history
Settings
  • Loading branch information
Iten-No-404 authored Dec 30, 2021
2 parents d0973f4 + 509f232 commit d646a7a
Show file tree
Hide file tree
Showing 7 changed files with 179 additions and 9 deletions.
3 changes: 1 addition & 2 deletions tumblr-replica/src/components/Activity/Activity.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ import NotificationsList from './NotificationsList';

import { getBlogId, fetchBlogs, setcurrentblog } from '../../states/features/userblogs/userblogsSlice';


/**
* Component for show the activity for the Blog it has graph
*
Expand Down Expand Up @@ -109,7 +108,7 @@ function Activity({ option }) {
}
console.log(Notes);
return (
<div>
<div>
<Grid container spacing={2}>
<Grid item xs={10} lg={6} sx={{ marginLeft: '10%' }}>
<Graph
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ const AccountSettingsPage = () => {
width: '625px',
}}
>
<Link to={'/profile/' + blog.username}>
<Link to={'/profile/' + blog.username} target="_blank">
<Box
component="img"
sx={{
Expand Down Expand Up @@ -251,7 +251,7 @@ const AccountSettingsPage = () => {
>
Make your likes public at:
</Typography>
<Link to={'/liked/by/' + user.blogName}>
<Link to={'/liked/by/' + user.blogName} target="_blank">
<Typography
component="h2"
fontSize="12px"
Expand Down Expand Up @@ -327,7 +327,7 @@ const AccountSettingsPage = () => {
>
Make your follows public at:
</Typography>
<Link to={'/followed/by/' + user.blogName}>
<Link to={'/followed/by/' + user.blogName} target="_blank">
<Typography
component="h2"
fontSize="12px"
Expand Down Expand Up @@ -456,6 +456,7 @@ const AccountSettingsPage = () => {
color: '#999999',
fontFamily: '"Favorit", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif',
}}
target="_blank"
>
<Typography
fontSize="12px"
Expand Down Expand Up @@ -503,7 +504,6 @@ const AccountSettingsPage = () => {
}}
variant="outlined"
fullWidth
autoFocus
disableRipple
disableElevation
style={{
Expand Down Expand Up @@ -613,6 +613,7 @@ const AccountSettingsPage = () => {
color: '#999999',
fontFamily: '"Favorit", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif',
}}
target="_blank"
>
<Typography
fontSize="12px"
Expand Down Expand Up @@ -660,7 +661,6 @@ const AccountSettingsPage = () => {
}}
variant="outlined"
fullWidth
autoFocus
disableRipple
disableElevation
style={{
Expand Down Expand Up @@ -709,7 +709,6 @@ const AccountSettingsPage = () => {
}}
variant="outlined"
fullWidth
autoFocus
disableRipple
disableElevation
style={{
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ const ContinueWithGoogleButton = () => {
sx={{ spacing: 8, mt: 1.5 }}
>
<Button
id="google-login-button"
onClick={renderProps.onClick}
disabled={renderProps.disabled}
fullWidth
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const HereIsWhatIsTrendingButton = () => (
size="large"
font='"Favorit", "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, sans-serif;'
style={{
color: '#FFFFFF', fontWeight: 'bold', textTransform: 'none',
color: '#000000', fontWeight: 'bold', textTransform: 'none',
}}
>
Here&apos;s what&apos;s trending
Expand Down
82 changes: 82 additions & 0 deletions tumblr-replica/src/states/blogthemeslice/blogthemeAPI.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
/* eslint-disable max-len */
import Axios from 'axios';
import { createAsyncThunk } from '@reduxjs/toolkit';
import { api, apiR } from '../../apis/globalAxpi';
import { apiR as apiReal, SERVICETYPE, MOCK } from '../../apis/globalAPI';

export const getBlogTheme = createAsyncThunk(
'blogTheme/getTheme',
async (blogName, { getState }) => {
if (SERVICETYPE === MOCK) {
try {
const response = await api.get(`blog/${blogName}/theme`);
return response.data.response;
} catch (e) {
throw Error(e);
}
} else {
try {
const state = getState();
const USERTOKEN = state.user.user.accessToken;
const AuthStr = `Bearer ${USERTOKEN}`;
const response1 = await apiR.get(`blog/info/${blogName}`, { headers: { Authorization: AuthStr } });
const blogInfo = response1.data.response;
const response = await apiR.get(`blog/${blogInfo.id}/theme`, { headers: { Authorization: AuthStr } });
return { theme: response.data, id: blogInfo.id };
} catch (e) {
throw Error(e);
}
}
},
);

export const putBlogTheme = createAsyncThunk(
'blogTheme/putTheme',
async (blogId, { getState }) => {
if (SERVICETYPE === MOCK) {
try {
const response = await api.put(`blog/${blogId}/theme`);
return response.data.response;
} catch (e) {
throw Error(e);
}
} else {
try {
const state = getState();
const USERTOKEN = state.user.user.accessToken;
const AuthStr = `Bearer ${USERTOKEN}`;
const body = {
replies_settings: state.blogSettings.settings.replies_settings,
color_title: state.blogTheme.theme.color_title,
font_title: state.blogTheme.theme.font_title,
title: state.blogTheme.theme.title,
font_weight_title: state.blogTheme.theme.font_weight_title,
description: state.blogTheme.theme.description,
background_color: state.blogTheme.theme.background_color,
accent_color: state.blogTheme.theme.accent_color,
body_font: state.blogTheme.theme.body_font,
header_image: state.blogTheme.theme.header_image,
avatar: state.blogTheme.theme.avatar,
avatar_shape: state.blogTheme.theme.avatar_shape,
};

const response = await Axios({
method: 'PUT',
url: `${apiReal}/blog/${blogId}/theme`,
headers: {
Authorization: AuthStr,
Accept: 'application/json',
'Content-Type': 'application/json',
},
data: body,
});
return response.data;
} catch (e) {
throw Error(e);
}
}
},
);

export const zero = 0;
// nevermind this. otherwilse will have to use a default export.
87 changes: 87 additions & 0 deletions tumblr-replica/src/states/blogthemeslice/blogthemeSlice.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
/* eslint-disable no-else-return */
import { createSlice } from '@reduxjs/toolkit';
import { getBlogTheme, putBlogTheme } from './blogthemeAPI';

const blogTheme = createSlice({
name: 'blogTheme',
initialState: {
theme: { },
// "color_title": "#000000",
// "font_title": "Gibson",
// "font_weight_title": "bold",
// "description": "dec",
// "title": "dec",
// "background_color": "#FFFFFF",
// "accent_color": "#e17e66",
// "body_font": "Helvetica Neue",
// "header_image": "www.image.com",
// "avatar": "www.jjj.com",
// "avatar_shape": "circle"
blogId: '',
status: '',
},
reducers: {
/**
* This function resets the status state
* @method
* @param {object} state The object that stores the current Status number
*/
resetStatus: (state) => {
const s = state;
s.settingsStatus = '';
},
/**
* This function sets whether Share Likes is on or not
* @method
* @param {object} state The object that stores the current ShareLikes value
* @param {object} action The object containing the new ShareLikes value
*/
setShareLikes: (state, action) => {
const s = state;
s.settings.share_likes = action.payload;
},
},

extraReducers: {
[getBlogTheme.pending]: (state) => {
const s = state;
s.isLoading = true;
},
[getBlogTheme.fulfilled]: (state, { payload }) => {
const s = state;
if (payload.theme.meta.status === '200') {
s.theme = payload.theme.response;
s.blogId = payload.id;
s.status = '200';
}
s.isLoading = false;
console.log('Blog Theme:', s.theme);
},
[getBlogTheme.rejected]: () => {

},
[putBlogTheme.pending]: (state) => {
const s = state;
s.isLoading = true;
},
[putBlogTheme.fulfilled]: (state, { payload }) => {
const s = state;
if (payload.meta.status === '200') {
s.theme = payload.response;
}
s.isLoading = false;
},
[putBlogTheme.rejected]: () => {

},
},
});

export const selectBlogTheme = (state) => state.blogTheme.theme;
export const selectStatus = (state) => state.blogTheme.status;
export const selectBlogId = (state) => state.blogTheme.blogId;
export { getBlogTheme, putBlogTheme };
export const {
resetStatus, setShareLikes,
} = blogTheme.actions;
export default blogTheme.reducer;
2 changes: 2 additions & 0 deletions tumblr-replica/src/states/store.js
Original file line number Diff line number Diff line change
Expand Up @@ -63,6 +63,7 @@ import themeReducer from './theme/themeSlice';
import notificationsReducer from './notifications/notificationSlice';
import searchStuffReducder from './search/searchSlice';
import searchAutocompleteReducer from './search/autocompleteSlice';
import blogThemeReducer from './blogthemeslice/blogthemeSlice';
import SumbitReducer from './submit/submitAPI';
import CreatePostReducer from './features/createpost/createpostSlice';

Expand Down Expand Up @@ -131,6 +132,7 @@ const store = configureStore({
searchAutocomplete: searchAutocompleteReducer,
postsubmit: SumbitReducer,
blogSettings: blogSettingsReducer,
blogTheme: blogThemeReducer,
CreatePostState: CreatePostReducer,
},
});
Expand Down

0 comments on commit d646a7a

Please sign in to comment.